|
|
Posted by Remy on 02/21/07 15:45
I've rewritten my page from using tables to CSS, so might still look a
little tabelish....
Now I have a problem with borders.
It looks good in IE and Safari, but Firefox only displays 3 sides for
some parts and funny enough, for different parts on Windows and on
Mac.
The page is built up of several parts that kinda look like this.
OnMouseOver they should become a boarder and a different background
color.
<div class="formEntry">
<img id="imgModule" class="briefing" src="images/documents.gif"
alt="Quellen Default" style="height:40px;width:40px;border-width:
0px;" />
<div style="width:400px; float:left;">
<h2><span id="lbTitle">Quellen</span></h2>
<input name="fileTextFileUpload" type="file"
id="fileTextFileUpload" style="margin-bottom:5px;" /><br />
<a id="lnkAddItem"
href="javascript:__doPostBack('ctl00$Main$ctrlBriefingUIItems
$ctl05$lnkAddItem','')">hallo</a>
</div>
<div style="clear:both;"></div>
</div>
For example purposes, I made the border red.
div.contentCreation div.formEntry
{
overflow:auto;
margin:1px;
padding:10px;
border-width: 1px;
border-style: solid;
clear:both;
border-color: Red;
}
This is the css in the normal (no mouseover) state. Most elements get
the border all around, but for some, specially "Quellen", the buttom
line is missing in Firefox.
You can see the page here:
http://www.blaettler.com/Test/borderissue/borderissue.html
It's a ASP.NET 2.0 page, so it has a lot of additional stuff in it.
Sorry. I run it through the W3C validator and that was ok.
If I leave away the overflow:auto; it works, but then the mouseover in
IE doesn't work in some areas.
Any ideas what I'm doing wrong?
Cheers
Remy
Navigation:
[Reply to this message]
|