html

[ajitdas57]

What is the html code to make horizontal boxes i need to make some boxes go from left to right but all i can find is on top of each other, you can see example here <a href="http://www.carinsurancequotesinformation.com&quot;>car insurance quotes</a> where the boxes are next to each other, and will this affect the page width on my site.

[pritaeas]

Just copy their HTML code. Use "view source" in your browser.

[Taywin]

HTML is not a code but it is a Mark-up language.

Anyway, you need to add style to your box (div) elements. You could use CSS to help with your style. To add style property, simply add it to your element tag. To arrange the layout you are asking for, you may need an outter div with relative positioning to hold the display. Then you can add float elements inside.

<div name="outterDiv" style="position:relative;width:100%">
  <div name="floating" style="float:left;border:1px solid black">
    Here is one float
  </div>
  <div name="floating" style="float:left;border:1px solid black">
    Here is another float
  </div>
  <div name="floating" style="float:left;border:1px solid black">
    Here is one more float
  </div>
  <div name="floating" style="float:left;border:1px solid black">
    Here is and more float
  </div>
  <!-- clear the floating property -->
  <div style="clear:both;height:1px">&nbsp;</div>
</div>


<!-- using CSS -->
<style type="text/css">
div.aContainer {
  position: relative;
  width: 100%;
}
div.floatingLeft { float:left; }
div.blackBorder { border: 1px solid black; }
div.clearFloat {
  clear: both;
  height: 1px;
}
</style>

<div name="outterDiv" class="aContainer">
  <div name="floating" style="float:left;border:1px solid black">
    Here is one float
  </div>
  <div name="floating" class="floatingLeft blackBorder">
    Here is another float
  </div>
  <div name="floating" class="floatingLeft blackBorder">
    Here is one more float
  </div>
  <div name="floating" class="floatingLeft blackBorder">
    Here is and more float
  </div>
  <!-- clear the floating property -->
  <div class="clearFloat">&nbsp;</div>
</div>

You could also use <li> tag with style as well... That's another approach...