Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    May 2010
    Posts
    146
    Thanks
    8
    Thanked 0 Times in 0 Posts

    split single div into 2 or more columns

    Right now this is showing the info in a long div column

    Code:
    div.navigation1 {width:200px; font-size:12px;background:#F4F4F4;}
    
    div.navigation1 ul {margin:0px; padding:0px;list-style:none;}
    
    div.navigation1 li {
    	height:100%;
    	list-style:none;
    	padding-left:10px;
    }	
    div.navigation1 a {
          float:left;
          background:url("../images/script_links.jpg") no-repeat left top;
          margin:0;
          padding:0 0 0 5px;
          text-decoration:none;
    	width:100%;
          }
    div.navigation1 a span {
          float:left;
          background:url("../images/script_links.jpg") no-repeat right top;
          padding:5px 15px 4px 6px;
          color:#24618E;
          display:block;
          }
    
    
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    div.navigation1 a span {float:none;}
        /* End IE5-Mac hack */
    div.navigation1 a:hover span {
          color:#FFF;
          }
    div.navigation1 a:hover {
          background-position:0% -42px;
          }
    div.navigation1 a:hover span {
          background-position:100% -42px;
          }
    How can i break up the column in multiple columns with one div tag.

  • #2
    Regular Coder
    Join Date
    Apr 2008
    Posts
    685
    Thanks
    15
    Thanked 105 Times in 104 Posts
    What is the HTML for this CSS? I'm guessing it's a list which is appearing vertically because you have set div.navigation1 a to width:100%;, so if you wanted the list in two columns then you'd change this width to 50%, or 100px seeing as div.navigation1 is 200px wide.


  •  

    Posting Permissions

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