CODEWITHSUNDEEP
csspositioninghtmlcss-float
Eddie
Eddie

Reputation: 255

CSS float and div block position

I have this problem then I try to float div left, each block contains same div class (member).

Block goes up if it is on the right hand side, but doesnt work on left.

Any thoughts?

.member {
    float: left;
    position: relative;
    width: 422px;
    margin: 0px 10px 10px 0px;
    height: auto;
}

example

image with example

Upvotes: 4

Views: 5916

Answers (1)

Míla Mrvík
Míla Mrvík

Reputation: 535

I suppose you want two columns with blocks of different height.

Then you should one column float to left and the second to the right:

Like this:

.member {
    position: relative;
    width: 422px;
    margin: 0px 10px 10px 0px;
    height: auto;
}

.fl_left {
    float: left;
    clear: left;
}

.fl_right {
    float: right;
    clear: right;
}

HTML:

<div id="left">
    <div class="fl_left">
        <div class="member"></div>
        <div class="member"></div>
    </div>
    <div class="fl_right">
        <div class="member"></div>
        <div class="member"></div>
    </div>
</div>

Upvotes: 3

Related Questions