[css] <hr /> aansluiten - Softwareontwikkeling

dinsdag 11 juli 2006 16:44

Acties:

Verwijderd

Topicstarter

ik probeer de ruimte aan de onderkant van een <hr /> in IE te doen verdwijnen. FF doet precies wat ik via css opgeef, maar IE blijft een margin tonen, terwijl ik die toch echt op nul heb gezet ... (line-height:0; is ook niet de oplossing) hoe moet ik dit oplossen voor IE?
voorbeeld: http://dev.arendlaan18.nl/tweak/

code:

body {
    font-family:Verdana, sans-serif;
    font-size:11px;
    line-height:14px;
    margin:0;
    padding:0;
    border:0;
}
div.box {
    background-color:#00CCFF;
}
hr {
    clear:both;
    border:0;
    margin:0;
    height:1px;
    margin-top:-7px;        
    border-top:1px solid #000000;
}
body>hr {
    margin-top:0;
}

<body>

<div class="box">&nbsp;</div>
<hr />
<div class="box">&nbsp;</div>

</body>

[ Voor 11% gewijzigd door Verwijderd op 11-07-2006 16:46 ]

dinsdag 11 juli 2006 16:49

Acties:

DeluxZ

Livin' the good life

margin-bottom: 0px

geprobeerd ipv margin:0 ?

Ik dacht altijd dat IE als iets kleiner was dan 21px oid dat de rest wit bleef ?

[ Voor 48% gewijzigd door DeluxZ op 11-07-2006 16:50 ]

]|[ Apple Macbook Pro Retina 13" ]|[

dinsdag 11 juli 2006 16:56

Acties:

Verwijderd

Topicstarter

margin:0; of margin:0px; maakt helaas niets uit ... ik geloof dat je bij 0 de eenheid mag weglaten in css

dinsdag 11 juli 2006 16:56

Acties:

Raynman

@Deluxz: dat zou niks uit moeten maken, maar met IE weet je het natuurlijk nooit... van die 21px zou ik niet weten.

Maar heb je padding: 0; al geprobeerd? (IE haalt margin en padding volgens mij vaker door elkaar, ook met lijsten o.i.d.)

dinsdag 11 juli 2006 16:58

Acties:

Verwijderd

Topicstarter

ook padding:0; had ik al geprobeerd ... helaas!

dinsdag 11 juli 2006 17:11

Acties:

RM-rf

1 2 3 4 5 7 6 8 9

Ik ben me niet zeker, maar zou het kunnen komen doordat het element in msie een display: inline (of eigenlijk inline-block) heeft en dus ook een line-height? het gaat dan mee in de flow van de text

Intelligente mensen zoeken in tijden van crisis naar oplossingen, Idioten zoeken dan schuldigen

dinsdag 11 juli 2006 17:12

Acties:

Rowanov

Kop eens wat anders...

Misschien is het in dit geval verstandiger om geen hr te gebruiken, maar een border-bottom. Dan ben je van een hele hoop gezeur af.

Als dit onjuist is, kan je misschien even toelichten wat je met de hr wilt bereiken

dinsdag 11 juli 2006 17:34

Acties:

Verwijderd

Topicstarter

ik wil de hr gebruiken om twee floats 'te clearen', dus na twee divjes die hr om daarna weer andere opmaak te plaatsen. het gaat mij niet echt om de toepassing maar ik baal al heel lang dat ik de hr niet volledig kan controleren dmv css! alle andere elementen krijg ik altijd voor elkaar, maar hr niet!

dinsdag 11 juli 2006 17:55

Acties:

Rowanov

Kop eens wat anders...

Dat clearen kan ook anders:

HTML:

<div id="container">
  <div class="item">
  Floatend ding
  </div>
</div>

Cascading Stylesheet:

#container {
  overflow: auto;
}
.item {
  float: left;
}

dinsdag 11 juli 2006 20:16

Acties:

BasieP

volgens mij gebruik je gewoon het verkeerde element op de verkeerde plek. De hr (horizontal rule) is gemaakt om stukken tekst te splitsen. niet om als border te dienen van 2 divjes oid

This message was sent on 100% recyclable electrons.

woensdag 12 juli 2006 07:45

Acties:

Verwijderd

Wellicht: font-size: 0px eens proberen?
Dat hielp bij mij om de hoogte van een div te kunnen instellen.

Over dat clearen op die andere manier met overflow:auto
Krijg je dan geen scrollbars in Firefox? Of is dat alleen als je een hoogte hebt gespecificeerd?

woensdag 12 juli 2006 13:03

Acties:

Rowanov

Kop eens wat anders...

Alleen bij een gespecificeerde hoogte; volgens de reference hoort er een scrollbar te komen in het geval de box overflowt. Zonder hoogte doet hij dit niet en zal hij dus geen scrollbar tonen. Ik heb wel een kanttekening; er zijn een aantal gevallen waarbij er soms 'random' een scrollbar tevoorschijn kwam in Firefox, die met een refresh verholpen waren. Heb alleen geen tijd gehad uit te vinden waar het vandaan kwam, aangezien het zo random was en het ook met de browser versie verschilde.