How do I adjust the header size to fit n any screen resolution?
This is the website: http://nelsonnaibert.com.br/
Hope you can helo me.
Thanks a lot!
Even on small screens, the header link is still set to:
.header-title {
display: block;
[COLOR="#FF0000"]width: 997px;[/COLOR]
height: 400px;
background: url(http://nelsonnaibert.com.br/wp-content/uploads/2013/02/NNaibert_Header9.gif) no-repeat 0 0;
text-indent: -9999em;
margin: 0 auto;
}
and you still have that big background image. You could switch to a different image, or change its size with background-size, although that’s a new property that doesn’t work on older browsers.
Thanks again for your help, Ralph. As you can see, I’m a begginer and I’m having some trouble with this header. When I replace width in pixels for 90%, there’s no way to align header and menu n the center of the page and, as you’ve mentioned, I still have the big background image.
Since the beggining, I wanted to have the white background associated to the main column and not as a background image, but didn’t know how to do that. Is that really a solution? If so, how can it do that?
Hi @laurabd;
We’re trying out a new product at SitePoint to help people fix broken CSS in real-time. Your problem looks like one that we could easily help you fix on the spot.
One of our CSS experts is online now and ready to help if you’re interested in giving it a try.
Edit: I’m removing the link to the product while we fine tune and develop further. Will keep you posted.
Finally I could solve the background issue, but still having trouble with the header image. Which would be the correct setting?
Thanks!
You can use a different background image at each break point, sized to fit, and serve it up via @media rules.
Hey @laurabd;
We’re running another test of our live CSS problem solving product.
If you want to utilise our experts to get your site sorted out immediately, you can check it out here http://codefix.sitepoint.com/
Now everything’s working great. Thanks again for your enormous patience!
Glad to hear it. 