Webpages aren't fitting in lower display settings

Is there a way that you can have a page resize it's self to fit someones display settings

I created a site which works fine on my computer   my display settings are at 1024   768

when someone who's display settings are 800 600  some of the parts of my webpage are larger than what fits in that screen and it distorts everything and it ends up looking junky.


Is there a way to set the pages to adjust to different settings?
WestonGroupAsked:
Who is Participating?
 
danataylorConnect With a Mentor Commented:
It looks like you are already sizing the total width of the outside frameset to fullscreen.  You can use the onload= option inside the frameset to call a function that executes the code I first listed to make sure the browser is fullscreen.

Change your outside frameset to:
<frameset framespacing="0" border="0" frameborder="0" cols="294,*" onload='ReSizeMe()'>

And put this between the <HEAD></HEAD> tags:
<script type="text/javascript">
function ReSizeMe()
{
window.resizeTo(screen.availWidth,screen.availHeight)
}
</script>

Haven't tested this and it time to go home now.  Will check in the morning and see how you're doing.
Good luck - CYA
0
 
danataylorCommented:
screen.width and screen.height objects give you the screen resolution

screen.availWidth and screen.availHeight  take any tool bars and tell you what is available

You could then resize the document accordingly.  This will resize it to 80% of the screen height and width

<script type="text/javascript">
window.resizeTo(screen.availWidth * 0.8,screen.availHeight  * 0.8)
</script>

0
 
WestonGroupAuthor Commented:
That didn't work,

unless I put it in the wrong place

I have a fram page

left frame, top frame and center frame

the top frame says    North Carolina Positions

on screens with display settings smaller than 1024  786  the positions get shifted to the next line and you have to scroll to see all the wording

I want it so no matter what display you have everyone can see all the wording when the pages loads...I don't want to have to shrink the font

is that what this coding does?  if so maybe i'm putting it in the wrong spot?

0
Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
danataylorCommented:
Please post the code that defines your frames.
0
 
WestonGroupAuthor Commented:
This is the top frame   do you need the left frame code and middle frame code?


<html>

<head>
<meta http-equiv="Content-Language" content="en-us">
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>North Carolina Positions</title>
<base target="contents">
</head>

<body>

<p align="left"><font size="7" color="#800000"><b>North Carolina</b></font><b><font size="7" color="#800000">
Positions</font></b></p>

</body>

</html>
0
 
danataylorCommented:
I need the page that builds the frames.  The one with the <FRAMES> tag.

Is your page structured like this:

____________________________
|                 TOP                              |
-------------------------------------------
|  L  |                                              |
|  E  |     MIDDLE                              |
|  F  |                                              |
|  T  |                                              |
---------------------------------------------
0
 
WestonGroupAuthor Commented:
________________
|  l    | TOP          |
|  e   |---------------
|  f    |     m          |
|  t    |                 |
----------------------

I used front page template

each frame has its own HTML code

this is the frames page html

<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 1</title>
</head>

<frameset framespacing="0" border="0" frameborder="0" cols="294,*">
  <frame name="left" scrolling="no" noresize target="rtop" src="northcarolinalinks.htm">
  <frameset rows="20%,*">
    <frame name="rtop" target="rbottom" src="northcarolinatop.htm" scrolling="no">
    <frame name="rbottom" src="northcarolinamain.htm" scrolling="auto">
  </frameset>
  <noframes>
  <body>

  <p>This page uses frames, but your browser doesn't support them.</p>

  </body>
  </noframes>
</frameset>

</html>
0
 
WestonGroupAuthor Commented:
Well its not the browser that needs resizeing its the monitor display settings

when the monitor display is less than 1074  768  even with the browser at full screen it still doesn't fit....

This is probably not able to be done but I will try the code u gave me

thanks
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.