3 replies [Last post]
craigtaylor74
craigtaylor74's picture
Offline
Regular
Barcelona
Last seen: 18 years 51 weeks ago
Barcelona
Timezone: GMT+1
Joined: 2004-02-04
Posts: 31
Points: 0

Can anyone tell me why this div:
<div id="bottomT_shadow2"></div>
with the following styles:

#bottomT_shadow2{
width:400px;
height:10px;
background-image:url(1.png);
background-repeat:no-repeat;
background-color:#FF00FF;}

shows up fine in firefox but in ie the containing div is double the height of the image. Here the background is pinky and the image is orange but if all were well you wouldn't see that at all.
See here http://www.ctam.co.uk/forum/forumQ.htm
Thanks.

http//www.ctam.co.uk

Stu
Stu's picture
Offline
Enthusiast
Bristol uk
Last seen: 19 years 1 week ago
Bristol uk
Joined: 2004-01-20
Posts: 282
Points: 0

ie doubles div height

This could be due to the text-size specified for the div.
Try adding overflow:hidden; to see if this will limit the height to the specified 10px.

BTW you can shorten the background style to ~

background:#f0f url(1.png) no-repeat;

It's not what you do it's the way that you do it.
So do it with STYLE
http://www.s7u.co.uk

moxie
Offline
Regular
Last seen: 18 years 18 weeks ago
Joined: 2004-09-23
Posts: 15
Points: 0

ie doubles div height

Another thing could be the use of PNG. IE does not support that type of image very well. Sometimes OK, but not most of the time.

Try using a GIF or JPG.

craigtaylor74
craigtaylor74's picture
Offline
Regular
Barcelona
Last seen: 18 years 51 weeks ago
Barcelona
Timezone: GMT+1
Joined: 2004-02-04
Posts: 31
Points: 0

ie doubles div height

Stu and Moxie,
changed the image type but that wasn't it. It was, as you said Stu, solved with overflow:hidden .
Thanks for your help,
Craig.

http//www.ctam.co.uk