ryno
ryno

Reputation: 374

A column with two divs and another with one

What would i put in the css to have one div ontop of another div (both squares are 10x10) and have another column with a div that is 10x20?

Let me rephrase that so its a little simpler, i want one big square that's 20x20. On the left half of that shape, it needs two 10x10 squares, one ontop of the other. On the right side, i need a div that is 10x20.

Please help need this for a class

Upvotes: 0

Views: 140

Answers (2)

sachleen
sachleen

Reputation: 31131

You can use css's position property to absolutely position elements to set top and left coordinates. You'll also need to use the height and width properties to size the boxes.

Upvotes: 1

Sean Thompson
Sean Thompson

Reputation: 902

Maybe something like this?

<div id="bigBox">
     <div class="leftBox"></div>
     <div class="leftBox"></div>
     <div id="rightbox">
</div>

<style>
    #bigBox { position: relative; width: 20px; height: 20px;}
    .leftBox {position: absolute; left: 0; height: 10px; width: 10px; }
    .rightBox {position: absolute; right: 0; width: 10px; height: 20px;}
</style>

Upvotes: 0

Related Questions