Prevent page content from being out of line when page size is decreased

Go To StackoverFlow.com

0

I just finished a rough draft of a site I've been constructing. Unfortunately, I'm starting to notice how poor the design looks both on smaller resolution screens as well as when the user shrinks his/her current screen size.

The site I'm referring to can be seen here. Furthermore, the functionality I'm looking for can be seen on most any professional site, but I especially noticed it on IBM's site. When the screen is minimized the header content stays intact along with the rest of the site. I was looking for overlow: auto somewhere in their css, but I did not see it anywhere.

What can I change to fix this issue?

PS: I figured it would be easier to link to my site rather than posting code here. However, if you want some code just let me know and I'll embed something in here.

Take care, Evan

2012-04-03 23:41
by NoName
1) Try this: http://stackoverflow.com/questions/2330889/set-image-size-with-respect-to-the-screen-resolution , By the way, put a mute button for the background music(it will make you site slightly better) - funerr 2012-04-03 23:46
I have been trying to, I could not find an elegant way to do so - any suggestions - NoName 2012-04-03 23:47
Are you talking about the Background-Music or the Dimensions - funerr 2012-04-03 23:48
My original question is asking about the dimensions of my page, @agam360 just brought up the music issu - NoName 2012-04-03 23:54


1

#full-height-template-container {
width: 1300px;  <-----  in your app here now the width is in %
border: 1px solid #262626;
height: 515px;
margin: 0 auto 20px;
overflow: auto;
}

as you see I used the width in pixels, this way the site stays intact. if this is what you need, then it's ok.. if not, let me know and I'll see what else can be done.

2012-04-04 00:18
by rmagnum2002
Bingo! - just what I needed - NoName 2012-04-04 00:53


1

IBM.com isnot doing anything noticeably different than you are.

If you want your design to be accessible and usable on different devices, you might consider responsive design. However, be sure it's worth your time. Your users might not be visiting with, say, an iPhone to make it worth your time.

Visually, what about having your menu span horizontally, instead of vertically? And also centering your image to its parent container?

2012-04-03 23:53
by dsawler
The client is insisting on a vertical menu (it was originally horizontal). What image are you referring to though - NoName 2012-04-03 23:55