Flow 2 columns of text automatically with CSS - HTML CSS CSS Layout

HTML CSS examples for CSS Layout:2 Column

  1. HOME
  2. HTML CSS
  3. CSS Layout
  4. 2 Column

Description

Flow 2 columns of text automatically with CSS

Demo Code

ResultView the demo in separate window 

<html>
 <head> 
  <style>

.content {width:1000px; height:210px; margin:20px auto; font-size:16px;}
.content p {width:490px; margin-right:10px; float:left;}

      </style> 
 </head> <!--  ww w . j  ava  2s .c o  m-->
 <body> 
  <!--Put your text inside a div with a class--> 
  <div class="content"> 
   <h1>Title</h1> 
   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus gravida laoreet lectus. Pellentesque ultrices consequat placerat. Etiam luctus euismod tempus. In sed eros dignissim tortor faucibus dapibus ut non neque. Ut ante odio, luctus eu pharetra vitae, consequat sit amet nunc. Aenean dolor felis, fringilla sagittis hendrerit vel, egestas eget eros. Mauris suscipit bibendum massa, nec mattis lorem dignissim sit amet. </p> 
   <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer eget dolor neque. Phasellus tellus odio, egestas ut blandit sed, egestas sit amet velit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;</p> 
  </div>  
 </body>
</html>

Related Tutorials