HTML and CSS Reference
In-Depth Information
Hey, the site is looking great, and
I really like the CSS table layout, but I
noticed that the header at the top with
the logo and the slogan doesn't expand with
the page. I mean, it feels like the slogan
should move to the right if I expand my
browser window.
Yup, we agree.
Except for the header, the Starbuzz page expands nicely as you
make your browser window wider. Thanks to the CSS table
layout, the columns expand proportionally as you expand the
window, and because the footer text is centered, the footer always
looks like it's in the middle of the page, whether the page is
wide or narrow. But the header doesn't expand as nicely. The
background color does, but the Starbuzz slogan always seems
stuck in the same place, while you might expect that it would be
anchored to the right side of the window.
The reason the header isn't expanding with the rest of the page
is because the header is
one
image with both the Starbuzz logo
and the slogan in it. And that image is exactly 800px wide. If
your browser window is opened wider than 800px, you see a lot
of extra space over on the right. And likewise, if your browser
window is narrower than 800px, you'll see the image fall off the
side of the browser window.
Can we fix it?
