1 reply [Last post]
gromeo
Offline
newbie
Last seen: 15 years 26 weeks ago
Joined: 2005-06-02
Posts: 3
Points: 0

How to position 2 divs like 2 boxes in a row?
Not one above another, but one next to the other?

Chris..S
Chris..S's picture
Offline
Moderator
Last seen: 8 years 10 weeks ago
Timezone: GMT+1
Joined: 2005-02-22
Posts: 6078
Points: 173

2 divs in a row, not one above another? how...?

You can float the first one or both.

e.g.

floating both:

#div1 {
width:200px;
float:left;
}

#div2 {
width: 100px;
float:left;
}

<div id='div1'>div 1 stuff</div>
<div id='div2'>div 2 stuff</div>

floating one:

as above, but remove both styles from #div2. Properly div2 isn't next to div1 (it occupies the space div1 occupies plus the rest of the width) but its contents will avoid div1.

position:absolute can also be used, but this can lead to other problems if there are elements that will come after the two divs.