xhtml: vraag over uitlijnen van tekst
scd op 25 januari 2012 #
Is er ook een simpele manier om in xhtml (of css) twee tekstgedeeltes op dezelfde hoogte te houden, waarbij het ene gedeelte links uitlijnt en het tweede gedeelte rechts?
Bijvoorbeeld:
Geachte heer, Zutphen, 2012
Ik kom er maar niet uit![]()
Edit:
het voorbeeld werkt natuurlijk niet. Geachte heer moet dus links uitlijnen, en Zutphen, 2012 helemaal rechts, maar wel op dezelfde regel.
nickybbb op 25 januari 2012 #
als je bv een css aanmaakt met de naam "datum_rechts" en dan zegt float right; dan kun je in die tekst de <span gebruiken>
bv:
Geachte heer, <span class="datum_rechts">Zutphen, 2012</span>
Dr. Maddox op 25 januari 2012 #
Ik heb even snel een voorbeeldje gemaakt maar nickybb was me voor zie ik al.![]()
Ik gebruik geen span maar gewoon div's. Wat op zich niet zo gek veel uitmaakt behalve wanneer styles in een browser zijn uitgeschakeld. Correct me if I'm wrong...
Voorbeeld:
http://tinyurl.com/774brsw
Ik kan helaas de code niet plaatsen. Ondanks de code tags op OMT maakt het forum er een bende van. Jammer....
arri op 25 januari 2012 #
Wat op zich niet zo gek veel uitmaakt behalve wanneer styles in een browser zijn uitgeschakeld. Correct me if I'm wrong...
span ('tekst-spanne' binnen een lopende tekst) lijkt me in dit geval beter, omdat dat het een inline element is, terwijl div (division) een block-level element is, meer bedoeld voor de document structuur.
Dr. Maddox op 25 januari 2012 #
Klopt maar in principe merk je er niet veel zolang je geen hoogte of breedte waarde geeft en het wordt gevalideerd toch? Ik vind div's altijd lekker kort..
Dan nog, bedankt voor de uitleg. Deze zal ik eens als goede gewoonte gaan toepassen.
Gates op 25 januari 2012 #
Er zijn meerdere opties, waarvan m.i. de toepassing afhangt van elk specifiek geval.
Wel zou ik voor span gaan i.p.v. een div. Ja, een div is valid html, maar in dit geval is het geen semantic html.
Jakko Westerbeke op 25 januari 2012 #
Je zou ook inline-blocks kunnen gebruiken. Iets als:
<div style="display: inline-block; text-align: left; width: 50%">Geachte heer,</div><div style="display: inline-block; text-align: right; width: 50%">Zutphen, 2012</div>(Niet getest, wellicht werkt het niet precies zoals bedoeld, maar dan heb je zelf tenminste ook nog wat te doen
)
Het nadeel daaraan is echter wel dat oudere browsers geen inline-blocks kennen en de divs dus gewoon behandelen als normale blokken — d.w.z. ze onder elkaar zetten.
arri op 28 januari 2012 #
Ervanuit gaande dat de document-content al is opgebouwd mbv. paragraph elements (<p></p>) en headers (<h…></h…>), is @nickybbb's eerste suggestie nogsteeds de beste..
<p>Geachte heer … <span style="float:right;">zutphen, 13 januari 1998</span></p>
Advertentie
Je kunt alleen reageren met een gratis OMT account.
Log in of registreer.