Jump to content

Some annoying details


pdfreires
 Share

Recommended Posts

I'm trying to make a CSS tab (something like this), it should have only three buttons, but I can't seem to work it out. If you check the source code of that link, you'll notice he just uses an unnordered list! :) I spent hours trying to float the list... ... And I can't understand why his simple solution works. He uses spans, I don't get it... I need the tabs to be positioned to the right of the screen, flowing from right to left. The tabs must be wrapped up in a div so it appears to be "inside" the header... My sheet would look like this...:

div#header {width: 760px;height: 135px;}			div#header .photo{width: 465px;background-color: #009;float: left;}			div#header div.wrapper{width: 285px;margin-left: 470px;}			div#header div.wrapper .logo{width: 285px;height: 115px;background-color: #06c;}			div#header div.wrapper .menu{width: 285px;height: 20px;background-color: #fc0;margin: 0;}

The HTML looks like this:

<body>      <div id="header">            <div id="header" class="photo"></div>            <div id="header" class="wrapper">                  <div id="header" class="logo"></div>                  <div id="header" class="menu"</div>            </div>      </div></body>

The menu should be wrapped in the class="menu" div. I tried to use an <ul> which list items have anchors inside. I floated it to right, I floated the anchors to the right as well and, when I did that, the list broke through the div. Any help? Or anyone could explain the solution I linked to? The style of my <ul> is something like this:

ul#menu {list-style-type:none;float:right;}ul#menu li{ display: inline; }ul#menu a{background-color:#some_color;padding:some_padding;  /*I don't know why, FF2 ignores the anchors padding when calculating line-height*/float:right;}

... and the HTML to the lists...:

<ul id="menu">      <li><a href="#">Item 1</a></li>      .      .      .      .</ul>

Thanks in advance... and sorry about the huge chunk of text... :)

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
 Share

×
×
  • Create New...