DesignersTalk - View Single Post - css

30equals · 05-04-2008, 11:26

hi all

i was wondering if it's possible - without using floats and adding custom margins to certain elements - to place div's inline and automatically create a margin between them.
sort of like aligning them justified

for instance, i have a container, and two div's. the container's width is 10 px larger than the total width of the 2 div's combined. so room for 10px margin between them
i want one div to the left and one to the right, so you automatically create that margin between the two.

i don't really want to use floats because the content will be created dynamically, and i'm not sure how many div's will be in the container in the end. and i don't know to what extend it will be possible to put some custom code in it to alternately use a float:left and float:right if you know what i mean.

i've already looked around, and found a partial solution for FF
display: -moz-inline-box;
but oddly enough this creates a margin of 5px to the left and right of the 2nd div.

and display:inline-block doesn't work either

any ideas ?

05-04-2008, 11:26	#1 (permalink)
30equals Senior Member Join Date: Jan 2006 Posts: 146	css - placing inline elements with margin hi all i was wondering if it's possible - without using floats and adding custom margins to certain elements - to place div's inline and automatically create a margin between them. sort of like aligning them justified for instance, i have a container, and two div's. the container's width is 10 px larger than the total width of the 2 div's combined. so room for 10px margin between them i want one div to the left and one to the right, so you automatically create that margin between the two. i don't really want to use floats because the content will be created dynamically, and i'm not sure how many div's will be in the container in the end. and i don't know to what extend it will be possible to put some custom code in it to alternately use a float:left and float:right if you know what i mean. i've already looked around, and found a partial solution for FF display: -moz-inline-box; but oddly enough this creates a margin of 5px to the left and right of the 2nd div. and display:inline-block doesn't work either any ideas ?