html - Would like to put texts side by side inside a DIV -


enter image description here

i looking achieve above inside div similar coding:

<div id="container3" style="position: relative;">     <div id="left" style="position: absolute; padding-left: 10px;">         company<br>our team<br>careers     </div> </div> 

css of parent div hold of text inside:

#container3 {     vertical align: top;     width: 80%;     height: 150px;     background-color: #ffffff; } 

maybe similar this:

enter image description here

html:

<ul class="footer">     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li>     <li class="link">         link     </li> </ul> 

css:

.footer{     background-color:#000000;     padding-left:5px; }  .link{     color:#ffffff;     list-style:none;     display:inline-block;     width:200px;     text-align:left; } 

demo

alternate solution: http://jsfiddle.net/xu76e/1/

html:

<div class="footer">     <ul class="footer-links">         <li class="link">             link         </li>         <li class="link">             link         </li>         <li class="link">             link         </li>         <li class="link">             link         </li>     </ul>     <ul class="footer-links">         <li class="link">             link         </li>         <li class="link">             link         </li>         <li class="link">             link         </li>         <li class="link">             link         </li>     </ul>     <ul class="footer-links">         <li class="link">             link         </li>         <li class="link">             link         </li>     </ul> </div> 

css:

.footer{     background-color:#000000;     overflow:auto; }  .footer-links{     padding-left:5px;     float:left;     padding:0px 20px;     list-style:none; }  .link{     color:#ffffff; } 

Comments

Popular posts from this blog

c# - Send Image in Json : 400 Bad request -

jquery - Fancybox - apply a function to several elements -

An easy way to program an Android keyboard layout app -