4 replies [Last post]
vivxdesign
vivxdesign's picture
Offline
Regular
Last seen: 13 years 2 days ago
Timezone: GMT-5
Joined: 2007-10-12
Posts: 17
Points: 0

I have an unordered list that I'm trying to use for a calendar application.

It contains two nested divs ([date] [entry text]). Both DIVs are floated left so that I can have even spacing.

The problem is: it works in IE7, but not in Firefox.

Do you guys have any ideas?

View the sample here.

I never met anybody who said when they were a kid, "I wanna grow up and be a critic."
- Richard Pryor

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 20 hours 5 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9772
Points: 3854

.bigNumber {  clear: left;

.bigNumber { clear: left; /*add this*/ font-family:Georgia; font-size:24px; float:left; color:#CCCCCC; width:66px; } .calendarEntry{ /*float:left; ⇐ remove this*/ font-weight:normal; }

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

vivxdesign
vivxdesign's picture
Offline
Regular
Last seen: 13 years 2 days ago
Timezone: GMT-5
Joined: 2007-10-12
Posts: 17
Points: 0

Whoa, it works! Thanks

Whoa, it works! Thanks Gary!

But, do you mind answering why it works? I've only used clear with an element next to a float element. I've never put both clear and float in the same element before. Is this common?

I never met anybody who said when they were a kid, "I wanna grow up and be a critic."
- Richard Pryor

gary.turner
gary.turner's picture
Offline
Moderator
Dallas
Last seen: 20 hours 5 min ago
Dallas
Timezone: GMT-5
Joined: 2004-06-25
Posts: 9772
Points: 3854

Consider that you want the

Consider that you want the big number to float next to its entry, while dropping under the previous pair. Without the clear, the next big nr would slide up the right side 'til it bumps into something, then slide left 'til it bumps into something else. That something else was the previous entry item or the previous big nr. The clear ensures the nr will drop below all floats and end up far left as desired.

It is critical that you study §9 Visual formatting model and especially §9.5.

cheers,

gary

If your web page is as clever as you can make it, it's probably too clever for you to debug or maintain.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 41 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

kk5st wrote: It is critical

kk5st wrote:

It is critical that you study §9 Visual formatting model and especially §9.5.

and anything else that goes 'bump' in the night Smile

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me