Tweet
Results 1 to 4 of 4
  1. #1
    Banned
    Join Date
    May 2012
    Location
    Australia
    Posts
    50
    Rep Power
    0

    Default How to make Box - Horizontal

    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 www.carinsurancequotesinformation.com where the boxes are next to each other, and will this affect the page width on my site.
    Someone told me use DIV tags but how do i put this in HTML code?

  2. #2
    MFC Member
    Join Date
    Sep 2012
    Posts
    243
    Rep Power
    12

    Default

    If you can not create any boxes then how can you develop your site further. You need to learn about the functionality of various tags of html.

  3. #3
    Junior Member
    Join Date
    Mar 2013
    Location
    Australia
    Posts
    10
    Rep Power
    0

    Default

    You can built boxes by table tags or by div tags. If you need multiple boxes at the same place then you can use table tags otherwise you can use div. give borders and adjust it with width and height. Your box is ready.


    business development consultant
    Last edited by Peter32; 04-13-2013 at 06:59 AM.
    Peter

  4. #4
    Junior Member
    Join Date
    May 2013
    Location
    245 Fischer Avenue, Suite A-1 Costa Mesa, CA 92626
    Posts
    18
    Rep Power
    0

    Wink

    This DIVs to sit next to each other by assigning a width and floating the elements, while making horizontal boxes...
    Here's the code. They should be used along with CSS to make-up the layout of the website.

    CODE

    <style>

    .boxWrap{
    width: 800px;
    margin: 0 auto;
    }
    .box {
    width: 200px;
    float: left;
    }


    /* Clearfix */
    .clearfix:before, .clearfix:after { content: ""; display: table; }
    .clearfix:after { clear: both; }
    .clearfix { *zoom: 1; }

    </style>

    <div class="boxWrap clearfix">

    <div class="box">
    Box 1
    </div>

    <div class="box">
    Box 2
    </div>

    <div class="box">
    Box 3
    </div>

    <div class="box">
    Box 4
    </div>

    </div>

Similar Threads

  1. Replies: 2
    Last Post: 10-08-2010, 11:01 PM
  2. Replies: 0
    Last Post: 10-25-2009, 02:31 PM
  3. Replies: 0
    Last Post: 06-11-2009, 04:34 PM

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Advertisement

Sponsors




Increase your deposit by 30%. Expand your trading opportunities. Earn more profit!