Jump to content

CSS: 2 columns


Recommended Posts

I have this menu with tabs on it for deferent info on products. The problems is that in this tab i added a list of two columns, but the info i placed on the list wont show. I dont have problems with the other tabs, thinking there might be a problem on the css or bad sintax.Code on css:

#lateral_X{width: 100px;background-color: #CCCCCC;float:left;}#lateral_Y{margin-left:190px;background-color: #FFFFFF;border:#000000 1px solid;}

code HTML

<div id="panel_02">	<div id="lateral_X">	 <li><p>Functions</p></li>	 <li><p>blablabla</p></li>	 <li><p>blablabla</p></li>	 <li><p>*Product</p></li>	 <li><p>*Product</p></li>	 <li><p>*Product</p></li>	 <li><p>*Product</p></li>	</div>	 <div id="lateral_Y">	 <li><p>Functons</p></li>	 <li><p>blablabla</p></li>	 <li><p>blablabla</p></li>	 <li><p>*Product</p></li>	 <li><p>*Product</p></li>	 <li><p>*Product</p></li>	 <li><p>*Product</p></li>								 </div></div>

Link to comment
Share on other sites

What do you mean, exactly? When I run that code, it shows two columns side by side with a 90px margin in between.What's the css styling for "panel_02"?
it wont show a thing on that section of the tab menu.te code for tab menu is:
div#panel {    position: relative;    width:400px;    height: 300px;} ul#tabs {    position:absolute;    left: 0px;    top: 0px;    margin:0;    padding:0;    width: 400px;    height: 24px;    z-index: 20;}    ul#tabs li {        float:left;        height: 23px;        padding-left: 8px;        list-style: none;        margin-right: 1px;        background: url(images/tabs.png) left -48px;    }    ul#tabs li.actual {        height: 24px;        background: url(images/tabs.png) left -72px;    }        ul#tabs li a {            display: block;                /* hack para ie6 */                .display: inline-block;                /* fin del hack */            height: 23px;            line-height: 23px;            padding-right: 8px;            outline: 0px none;            font-family: arial;            font-size: 10px;            text-decoration: none;            color: #000;            background: url(images/tabs.png) right 0px;        }                ul#tabs li.actual a {            height: 24px;            line-height: 24px;            background: url(images/tabs.png) right -24px;            cursor: default;            }/* Panel Configuration */div#panel #paneles {    position: absolute;    left: 0px;    top: 26px;    width: 398px;    height: 275px;    border: 1px solid #91a7b4;    background: #fff;    overflow: hidden;    z-index: 10px;}    div#panel #paneles div {        margin:10px;        width: 378px;        height: 255px;        font-family: arial;        font-size: 12px;        text-decoration: none;        color: #000;        overflow: auto;    }

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Create New...