[CSS] 1px solid border rare pixel linksonder

[bastv]

Plaatje zecht al genoeg denk ik.
Sommige divs doet hij het wel goed en sommige niet (alleemaal hebben ze dezelfde id)
firefox doet het overigens wel goed.
Is er een fix voor IE?

[ Voor 4% gewijzigd door bastv op 14-08-2006 13:50 ]

[BtM909]

Naast het plaatje hebben we ook relevante code nodig Kan je het reproduceren met een simpelere test-case? Is het wel goed na een refresh of een resize van je window?

[ Voor 21% gewijzigd door BtM909 op 14-08-2006 13:55 ]

[bastv]

resize of reload maakt niet uit. zijn altijd dezelfde met die fout.

testcode

HTML:

<div id="menurechts">
<h2>Uit dienst</h2>
<ul>
<li>Niemand uit dienst!</li>
</ul>
</div>
<div id="menurechts">
<h2>Uit dienst</h2>
<ul>
<li>Niemand uit dienst!</li>
</ul>
</div>

Cascading Stylesheet:

#menurechts {
background-color:#fafcff;
margin-right:5px;
margin-bottom:5px;
border:1px solid #909090;
}
#menurechts ul {
margin: 0 0 1em 0;
padding: 0;
list-style-type: none;
margin-left:2px;
margin-bottom:2px;
}

#menurechts li {
background:url(../images/style2/bullit.gif) no-repeat -.2em .1em;
padding-left: 10px;
font-family: Arial;
font-size: 8pt;
}

#menurechts h2 {
padding:1px;
border-left:2px solid #969696;
margin:0 0 1px;
margin-left:0px;
height:15px;
font-weight:bold;
color: #fafcff;
background: #969696 url(../images/style2/menuheader.jpg);
}

#menurechts li a {
color:#505050;
text-decoration:none;
}

#menurechts li a:hover {
color:#808080;
text-decoration:underline;
}

[ Voor 6% gewijzigd door bastv op 14-08-2006 14:02 ]

[André]

Bij mij werkt het gewoon prima in FF en IE. Misschien ligt het aan de plaatjes? die kan ik hier niet zien.

[mithras]

Maar een id is toch voor een uniek element, dus waarom gebruik je geen class. Misschien dat het ombouwen naar een class het probleem verhelpt?

[bastv]

wat is het verschil met class ?
En het zal niet aan de plaatjes liggen omdat als ik een div kopier die een rare pixel heb (dus 2 keer laat zien op de site) hij het wel goed weergeeft. Het is gewoon een probleem van internet epxlorer maar een niet veel voorkoment probleem want op google kon ik ook al niets vinden.

[crisp]

Over het algemeen is het toch acceptabel dat een layout in verouderde browsers niet helemaal pixel-perfect is?

Het lijkt mij overigens op afrondingsfoutjes van IE...

[TeeDee]

offtopic:
Ik heb het met FireFox 1.5.0.6 ook, zelfs in dit topic. Dus dat het alleen aan IE ligt lijkt me niet helemaal correct.

[Reinier]

Of het nu een fout in IE en/of FF is of niet, een id moet uniek zijn en dat zijn ze in jouw voorbeeld niet. Dat is in ieder geval fout

[bastv]

als ik id of class gebruik maakt qua opmaak niets uit

[mithras]

bastv schreef op maandag 14 augustus 2006 @ 14:28:
als ik id of class gebruik maakt qua opmaak niets uit

Maar de functie van een id meegeven, is dat je het unieke element kan benaderen (met css, javascript etc). Een class groepeert elementen die dezelfde eigenschappen bevatten (kleur, grootte etc).
Een id is dus per definitie uniek, en omdat je meerdere "menurechts" gebruikt, moet je dan geen id, maar een klasse meegeven (die je dan niet met # maar met . aanspreekt, dus .menurechts, of div.menurechts, voor specifiek de div)

[SiliconError]

Maakt het uit als je de resterende em's omzet naar pixels? Misschien dat er dan geen afrondingsfoutjes ontstaan in brakke browsers.