CODEWITHSUNDEEP
htmlcss
tanveer javaid
tanveer javaid

Reputation: 131

CSS align div 1 to center and div 2 to right align

Please have a look http://jsfiddle.net/zygnz/1/

<div class="container">
        <div class="left">
            LEFT
        </div>
        <div class="right">
            RIGHT
        </div>
</div>

Can we align left side block to center of the page and right side in remaining place..?

Upvotes: 4

Views: 600

Answers (2)

jameson
jameson

Reputation: 63

I created a fiddle for you. It will work if you use fixed width for the divs. If not just rewrite the CSS with some javascript.

CSS:

.container
{
display:block;
width:400px;
height:250px;
background-color:black; /* not necessary */
}

.center
{
width:100px;
height:240px;
background-color:white; /* not necessary */
float:left;
margin-left:150px; /*(width_of_container/2)-(width_of_center/2)*/
}

.right
{
width:100px;
height:240px;
background-color:white; /* not necessary */
float:right;
}

Upvotes: 0

aldux
aldux

Reputation: 2804

If you mean to centralize div 1 to the remaining space (container - div2), you can style container with text-align:center and float div 2 to the right.

Otherwise I'd use position absolute.

Upvotes: 2

Related Questions