stdcerr
stdcerr

Reputation: 15628

optimizing my page for smaller screen resolutions

I'm having issues to optimize my page for smaller screen resolutions. When I take my browser window (Google Chrome) and shrink it, the menu bar pops onto a second line way before there's no more room for it on top. i would like the black area on the left of the logo to shrink first to be aligned with the content box and then only once there's no more room for the content, there also is no more room for logo and menu on top... but how can I get this achieved I'm wondering? Thanks for help!

The url: http://quaaoutlodge.com/drupal-7.14/?q=lodge

Upvotes: 0

Views: 87

Answers (2)

stdcerr
stdcerr

Reputation: 15628

I actually had to remove the inner padding on the left side of the logo and instead give the "toplogo" a fixed width (in pixels) with auto margin on either side to get it centered on the page. That seems to give me what I was looking for.

Upvotes: 0

keaukraine
keaukraine

Reputation: 5364

You may want to use CSS3 media queries. Using them you can specify separate styles for different browser sizes. More info about responsive design you can find here: http://www.w3.org/TR/css3-mediaqueries/#width

Upvotes: 1

Related Questions