I put together a tweak of your page. I did so under the assumption that
you wanted a static width; 820px. It's a different story if you going
after a squishy layout. I also tweaked the html and made it simpler. I
took out the H1 and H4 tag because those tags are often best used in the
body content of the page.
Peter Williams wrote:
>I am working on a site where I have a header that contains:
>- Company logo (image wrapped in h1 on left)
>- Site wide navigation bar (styled ul, middle right)
>- Catchy slogan (h4, bottom right)
>I have an example page that can be viewed at:
>The sample page has a screen cap under the actual header showing
>the relationship of the elements as intended. If you resize the
>page, or resize the text the "catchy slogan" jumps around and gets
>quite out of control at some sizes. I think I have overcomplicated
>the markup and styles for the header (all styles in head of page
>for the sample page).
>How can I better contain the contents of the header div?
>Should I be using a different unit of size for the text parts?
>I'm not sure why I'm having so much trouble with this, but I seem
>to have some sort of stylers block ;-)
>Thanks in advance for all help rendered.
>I'm not sure if my original request hit the list at a bad time
>or something on Friday but I only got one reply (thanks Roy) and
>I can't really use the suggested <br /> since it adds whitespace
>that doesn't belong.
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/