CSS - IE/Firefox problem - element height

M

matt

hello,

i am experiencing a little problem w/ regards to IE & Firefox
compatibility (works as expected in firefox, doesnt in IE).

i have a container-div element, which contains 1 image, and 2 nested
div elements. the problem is, in IE the height of the container-div is
extended -- it makes itself as high as *all* elements w/i in, rather
than the fixed-height i have assigned in px.

easier to show. here is a dummied-down demo of the problem:

http://www.semi-suave.com/temp/temp.html
http://www.semi-suave.com/temp/css/profile.css


and here is an image of what IE is doing to my height:

http://www.semi-suave.com/temp/the_problem.jpg


.....can anyone help me figure this out? i want the container-div (the
baby-blue box) to be only "130px", as its defined in mh "profile.css"
file. how do i stop it from auto-sizing itself to the height of all its
nested content!??


thanks!
matt
 
K

kaibo

change the css for your pictures as follows

#Profile img {
display:inline;
}

You won't need the positioning any more.

Same for #Basics & #Ratings...if you still need them.
 
D

David Graham

hello,

i am experiencing a little problem w/ regards to IE & Firefox
compatibility (works as expected in firefox, doesnt in IE).

i have a container-div element, which contains 1 image, and 2 nested
div elements. the problem is, in IE the height of the container-div is
extended -- it makes itself as high as *all* elements w/i in, rather
than the fixed-height i have assigned in px.

easier to show. here is a dummied-down demo of the problem:

http://www.semi-suave.com/temp/temp.html
http://www.semi-suave.com/temp/css/profile.css


and here is an image of what IE is doing to my height:

http://www.semi-suave.com/temp/the_problem.jpg


....can anyone help me figure this out? i want the container-div (the
baby-blue box) to be only "130px", as its defined in mh "profile.css"
file. how do i stop it from auto-sizing itself to the height of all its
nested content!??


thanks!
matt
I came up against this and was told IE has a broken overflow behaviour - a
div in IE extends itself to encompass the contents of the div, it shouldn't
do this!
David
 
M

matt

change the css for your pictures as follows
...
You won't need the positioning any more.

ah...excellent! thank you. also, setting the parent element's
"overflow:hidden;" helps tighten things up as well.

one step closer to eliminating tables.

the more you know.


thanks,
matt
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,744
Messages
2,569,484
Members
44,903
Latest member
orderPeak8CBDGummies

Latest Threads

Top