ThemeShaper Forums » Thematic


Trying to get this look in the header to no avail

(2 posts)
  • Started 8 years ago by Algo
  • Latest reply from ScottNix
  • This topic is not resolved
  1. Algo


    I'm trying to achieve, basically, this look for the header of my site: . I've played with the CSS for a few days now in my spare time and just can't figure out what I am doing wrong. I've gotten the navigation to be flush with the top-right of the header div and I've gotten it to be aligned with the bottom but no matter what I do I can't get it flush bottom and right (when the menu is at the bottom #access will be wildly off to the side somewhere most of the time).

    I'm about to just give up and throw it all in tables but I would prefer not to if I can help it.

    Posted 8 years ago #
  2. Since headers tend to be fairly static, a lot of times I give my header a default width. Once the header has a default width, for example 960px, since it is already positioned relative, you can absolute position items inside.

    #header { width: 960px; }
    #branding { position: absolute; top: 0; left: 0; height: 200px; width: 300px; }
    #access { position: absolute; bottom: 0; right: 0; height: 50px; width: 400px; }

    The branding and access will need correct widths, and you have to also shorten the width on the .menu class also, its default is 940px.

    If you needed a repeating background image and body background CSS is already used, then you may have to actually move your access inside the branding and use your branding as your relative positioned start.

    Posted 8 years ago #

RSS feed for this topic

Topic Closed

This topic has been closed to new replies.