www.webdeveloper.com
Results 1 to 2 of 2

Thread: divs inside a div

  1. #1
    Join Date
    Sep 2008
    Location
    Harrisonburg, VA
    Posts
    151

    divs inside a div

    I am trying to put multiple divs inside of another div and have them scroll inside the divs... I have the first div with the float set to left and the next 2 float set to right....

    Code:
    div.innerOne
    {
    	height:95%;
    	width: 45%;
    	float: left;
    }
    div.innerThree
    {
    	height:95%;
    	width: 45%;
    	float: right;
    }
    div.innerTwo
    {
    	height:95%;
    	width: 45%;
    	float:right;
    }
    What is happening is that the first Div is fine and the 2nd is directly to the right of it.

    The third is on the right side below the 2nd.

    I want it on the right side of the 2nd Div

  2. #2
    Join Date
    Dec 2005
    Posts
    2,984
    Hmmm...are you sure you want divs? Maybe you want an unordered list something like this:

    HTML Code:
    <div id="parent">
     <ul>
       <li class="blockOne">&nbsp;</li>
       <li class="blockTwo">&nbsp;</li>
       <li class="blockThree">&nbsp;</li>
    </div>
    And then you could have your stylesheet something like this:

    Code:
    #parent li { list-style: none; display: block; float: left; width: 45&#37;; height: 95%; border: 1px solid #000;}
    You might need to play around with the value of width to keep the blocks from wrapping. The border is just there so you can see the blocks.


    Alternatively, if you do need to use divs, then just style them all the same:

    HTML Code:
    <div id="parent">
      <div class="innerOne">&nbsp;</div>
      <div class="innerTwo">&nbsp;</div>
      <div class="innerThree">&nbsp;</div>
    </div>
    Code:
    #parent div { float: left; width: 45%; height: 95%; border: 1px solid #000; }

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles