Nidhin_toms
Nidhin_toms

Reputation: 737

Div side by side issue

I have an issue with my CSS - I am have two divs - "section1" and "section2". I want them to be displayed side by side but they are being displayed as seen in the picture. Does anyone know how to display them side by side?

issue

  <div id="section1">
   <h1><London></h1>
    <p>London is the capital city of England. It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants</p>
  </div>

  <div id="section2">
  <h2><London></h2>
  <p1>London is the capital city of England. It is the most populous city in the United Kingdom,
with a metropolitan area of over 13 million inhabitants</p>
 </div>

</div>

#section1
{
float:center;
padding:5px;
background-color:lime; 
margin-left:20px;
width:300px; 
}

#section2
{
float:right;
background-color:lime; 
margin-left:10px;
width:300px;
}

Upvotes: 1

Views: 50

Answers (2)

user5952891
user5952891

Reputation:

You can also add clear:both; or clear:none; to your css. This allows relative objects to park side by side, or be forced below an existing object. This command works best on crowded pages.

Upvotes: 1

nur-sh
nur-sh

Reputation: 223

Your float property should be left not center and right and hopefully that moves them side by side.

Upvotes: 2

Related Questions