Floats and "clear"

[longhair]

I have a page that's causing me some problems in FireFox 1.5 but not
IE6.

I have a <dl> with the <dt> and <dd> both within defined with "float:
left" to have a table-like look.

See it at http://bubba.textdriven.com/partners.htm and
http://bubba.textdriven.com/partners-2.htm.

The issue I'm concerned with is the following block - an <h3> - does
not get cleared in FF (partners.htm), so I've tried a "clear: both" for
the H3 (see partners-2.htm). However, the bottom of the <dl> and the
top of the <h3> are then squished together too close.

This does not happen in IE, but perhaps that's a problem with IE.

What do I need to do so that I can have a table-like structure for my
contact details, while still having a nice gap between it and the next
block? I haven't had much luck styling the <dl>, except for a very
large bottom padding or margin, which then screws up IE.

Obvious answer is to use a table I suppose, but any other options I
could go for? I'm open to anything.

[Jim Moe]

longhair wrote:

The issue I'm concerned with is the following block - an <h3> - does
not get cleared in FF (partners.htm), so I've tried a "clear: both" for
the H3 (see partners-2.htm). However, the bottom of the <dl> and the
top of the <h3> are then squished together too close.

Use padding instead of margin.

--
jmm (hyphen) list (at) sohnen-moe (dot) com
(Remove .AXSPAMGN for email)

[Jasen Betts]

On 2006-03-29, longhair <ha*******************@yahoo.co.uk> wrote:

I have a page that's causing me some problems in FireFox 1.5 but not
IE6.

I have a <dl> with the <dt> and <dd> both within defined with "float:
left" to have a table-like look.

See it at http://bubba.textdriven.com/partners.htm and
http://bubba.textdriven.com/partners-2.htm.

The issue I'm concerned with is the following block - an <h3> - does
not get cleared in FF (partners.htm), so I've tried a "clear: both" for
the H3 (see partners-2.htm). However, the bottom of the <dl> and the
top of the <h3> are then squished together too close.

This does not happen in IE, but perhaps that's a problem with IE.

What do I need to do so that I can have a table-like structure for my
contact details, while still having a nice gap between it and the next
block? I haven't had much luck styling the <dl>, except for a very
large bottom padding or margin, which then screws up IE.

Obvious answer is to use a table I suppose, but any other options I
could go for? I'm open to anything.

set explicit margins on both elements.

--

Bye.
Jasen

[kchayka]

longhair wrote:

I have a <dl> with the <dt> and <dd> both within defined with "float:
left" to have a table-like look.

See it at http://bubba.textdriven.com/partners.htm and
http://bubba.textdriven.com/partners-2.htm.

Looks like tabular data to me. Use a table.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.