[Div] Probleem met inline renderen

[LauPro]

Omdat een lay-out opbouwen met tabellen geen mooie oplossing is ben ik met wat div's gaan spelen om het zelfde effect te krijgen. Ik heb nu echter een probleem en dat is dat ik 2 div's niet 'naast' elkaar krijg.

HTML:

<div style="display:inline">Tekst1</div>
<div style="display:inline">Tekst2</div>

De uitvoer van deze code komt mooi naast elkaar te staan, nu wil ik wat complexer aan gang gaan en bijvoorbeeld het volgende doen:

HTML:

<div style="display:inline;width:200px">Tekst1</div>
<div style="display:inline;width:300px">Tekst2</div>

In IE gaat dit prima echter Mozilla en Opera willen maar niet geloven dat die div 200 of resp. 300 px breed moet zijn . Dat is op zich logisch, want een inline-element kan natuurlijk geen breedte krijgen alleen ik wil wel 2 div's naast elkaar hebben om een goede lay-out te kunnen opbouwen. Alles vastzetten is geen optie (of imo geen mooie optie). display: inline-block is ook geen optie omdat de div's dan niet meer naast elkaar willen.

Heeft iemand een idee hoe ik dit voor elkaar krijg in elke browser?

[ Voor 18% gewijzigd door LauPro op 22-10-2003 22:43 ]

[Verwijderd]

float: left; bijvoorbeeld.

En van een div een inline element maken heeft geen zin natuurlijk, daar is een span voor. Maar als het om complete zinnen gaat kun je dan nog beter p gebruiken.

[LauPro]

Hmmt, al hoewel de term 'float' anders doet vermoeden werkt het wel .

[Justice]

als je iets inline displayed is het geen block level element meer dus dan kan je daar geen width aan geven.

'width' doesn't apply to inline elements, and neither does
'height', as per CSS2.1:10.3.1
(http://www.w3.org/TR/CSS21/visudet.html#q4). IE4/Win and IE5/Win
did improperly apply those properties to inlines, and IE6/Win will do
the same when in quirks mode. In standards mode, it won't, and
neither will other browsers.
Note that CSS2.1 introduces a new 'display' type called
'inline-block'
(http://www.w3.org/TR/CSS21/visuren.html#propdef-display) that allows
for an inline box to be treated sort of like a block-level element,
but without the "line breaks" to before and after. Unfortunately
browser support for inline blocks is not the best right now, so
relying on them is dicey.

http://archivist.incutio.com/viewlist/css-discuss/18586