By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
440,569 Members | 1,394 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 440,569 IT Pros & Developers. It's quick & easy.

Floats and "clear"

P: n/a
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.

Mar 29 '06 #1
Share this Question
Share on Google+
3 Replies


P: n/a
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)
Mar 30 '06 #2

P: n/a
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
Mar 30 '06 #3

P: n/a
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.
Mar 30 '06 #4

This discussion thread is closed

Replies have been disabled for this discussion.