3
Contributors
2
Replies
3
Views
4 Years
Discussion Span
Last Post by Taywin
0

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...

Edited by Taywin

This topic has been dead for over six months. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.