|
|
Posted by Jonathan N. Little on 02/21/07 17:35
Remy wrote:
> 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?
>
Well, everything is sized in pixels and your have DIVs floating inside
of fixed DIVs with 'overflow:auto;' so if the inside DIV is too big it
will overlap the bottom border. Noticeable in Firefox if you
incrementally decrease and increase the font size you will see borders
disappear and reappear...
Also what is the SPAN for inside the H2s?
<h2><span
id="ctl00_Main_ctrlBriefingUIItems_ctl03_lbTitle">Zielpublikum</span></h2>
If you are just using it to create an anchor, just put the ID on the H2
<h2 id="ctl00_Main_ctrlBriefingUIItems_ctl03_lbTitle">Zielpublikum</h2>
--
Take care,
Jonathan
-------------------
LITTLE WORKS STUDIO
http://www.LittleWorksStudio.com
Navigation:
[Reply to this message]
|