Jump to content

pdfreires

Members
  • Posts

    3
  • Joined

  • Last visited

Previous Fields

  • Languages
    (X)HTML, learning CSS, PHP and JavaScript

Contact Methods

  • Website URL
    http://
  • ICQ
    0

Profile Information

  • Location
    Brazil

pdfreires's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. Oh... wow... huge... thanks...
  2. 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...
  3. The solution I'm posting works just fine to me... It's a solution based in absolute positioning, though.You should use a div to wrap all the content you want to be centered. Make its position absolute and move the left edge to 50%. Then use a negative left-margin to center the div. If you're left margin is minus the half of the box's width, then its center will be positioned at 50% of the page (the left-edge), a.k.a centered. Example: div#container {position:absolute;width:760px;left:50%;left-margin:-380px;} Following the same logic, you can vertically center any content. If don't want to wrap all the content in a box, you can fix body's width (or height) and just center the body. I got this solution here. If you want to center with auto-width, check this one instead. That's it.
×
×
  • Create New...