How do I create two columns using CSS?

Question

I'm new to CSS and I wonder how I could make two columns and also two rows inside wrapper. The first row contains title images. Here's my code: http://sudrap.org/paste/text/24958/

What I want to achieve: enter image description here

Edit: Here's the whole html http://sudrap.org/paste/text/24961/

Artyom · Accepted Answer · 2011-08-31 22:13:38Z

1

You don't need all that HTML. It could be as simple as this:

<div id="main-wrapper">
    <div class="left-box">
        <h2>Oyunlar</h2>
        <ul>
            <li>...</li>
        </ul>
    </div>
    <div class="right-box">
        <h2>Sunumlar</h2>
        <ul>
            <li>...</li>
        </ul>
    </div>
    ...
</div>

with the following CSS:

.left-box, .right-box {
    width: 15em;
    float: left;
}
.right-box {
    border-left:1px solid #999;
}
.right-box h2 {
    margin-left: -1px; /* hide box border */
}
.box h2 {
    background-color: #D8E9E6;
    border-top: thin solid #97b4e0;
    border-bottom: thin solid #97b4e0;
}

answered Aug 31, 2011 at 22:13

Artyom

1,58912 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How do I create two columns using CSS?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related