[SOLVED] Padding makes it overflow out of height in FF

[play_]

Say I have a 'menu' div of 20px in height.

Inside it, i have links. i pad the links 10px on top and 10px on right. Instead of expanding the menu div, it overflows out of the menu border.

 

Is there way to make it so the menu expands accordingly?

 

Another thing i was doing was i had the links inside a div. then i made the div float, and the height shrank. anyone knows why this happens?

 

 

thanks.

[moberemk]

Hmm... Check to see if you have valid HTML and CSS, as well as a Doctype. Fix any errors, and if that doesn't help, just increase the height of the div.

[ToonMariner]

you should try and avoid fixed heights when possible...

[play_]

that's the thing. I don't want fixed heights..

 

here';s an example:

http://decay.nu/hello.html

[moberemk]

Well, I managed to fix the example page by floating both elements. Maybe that would help?

[SuperBlue]

Just throwing in my "Rock", you should all check the technique i use on www.brugbart.dk; also the link in my sig.

 

 

Never mind the "Updated Version" i created, just use the first; The reason i havent updated my own version yet, is it seams Safari have a problem rendering the "updated version", so i'd rather stick with what i know works, until i find out why Safari renders the "uv" wrong.

 

Also, i tend to avoid using padding where i know it course problems, and with good results.. Mostly you will be able to use margin insted, or something intirely different.

[bronzemonkey]

add {display:block} to the anchor

 

.menu a{
        display:block;
border:1px solid blue;
padding:10px 0;
}

[play_]

thanks all.