Nicole Aebi wrote:
> I've set up a div in my website to be a grey horizontal bar of 10px
> in height. It's quite a nice thinish line in Safari and Firefox but
> in IE it's this big hulking line - probably twice the height.
> The url is www.aebi-moyo.com
> I've tried to find an answer but to no avail.
One line-height to be exact, since IE doesn't understand that the div is
empty - thus will "see" a space inside it. David and Francky have
already posted a cure for that particular IE-bug.
> Any thoughts?
May I suggest that you delete the entire <div id="horizontalbar"></div>
and associated styles, replacing the bar with styling on another element.
Eliminating as many "style only" elements as possible in the source-code
is seen as good practice, and the stylesheet ends up being simpler too.
The following changes/additions will do...
#horizontalbar { ... } <-- delete the entire style.
#title {
position:absolute;
top:20px;
right: 10.1%;
margin-right: -10%;
padding-right: 10%;
width: 100%;
border-bottom: solid 10px #666;
}
#title img {
float: right;
}
...where the border on #title becomes the bar, and the line-up is
perfectly stable and avoids the mentioned bug.
(I killed a couple of Gecko-bugs in there, which is why the values may
seem a bit odd.)
This new #title is 110% wide in standard-compliant browsers, but that
doesn't matter since the overshooting part ends up outside the left side
of the browser-window.
regards
Georg
--
http://www.gunlaug.no
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
