• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 247
  • Last Modified:

Website design that dynamically fits page within destination browser

How can a website be designed so that pages automatically fit within the destination browser? Is it possible to programmatically detect the browser and screen resolution so that a page fits perfectly within a browser?
0
timonline
Asked:
timonline
  • 2
  • 2
2 Solutions
 
NickVdCommented:
Yes it is progammatically possible to detect sizes and whatnot, but it's not needed.

Simply design with percents and em's using css and you'll be fine. need a main container that is 90% and centered? with a minimum width of 770 and a maximum of 1000

<div id="maincontent">
lorem ipsum
</div>

#maincontent {
  width: 90%;
  min-width: 770px;
  max-width:1000px;
  margin:0 auto; /*center*/
  border:1px solid red;
}

The div will always take up either a minimum of 770, a maximum of 1000 or 90% of the width of the client window depending on how you set the rules up, you can make a site look perfect in almost any resolution.
0
 
timonlineAuthor Commented:
NickVd, Thanks alot...
I am bit hazy on a couple of things, firstly what are "em's"?, secondly, what is "lorem ipsum" within the div tag?

With an existing site that has fixed width div tags, if I create a container (like in your example) and then make all existing div tags subordinate to this container, will the content in the existing div tags resize in the client browser according to the rules in the new container?
0
 
ahoffmannCommented:
> with a minimum width of 770 and a maximum of 1000
and soon you break the rules :-/

Just use relative sizes in em or ex mainly, px just for borders. That's all and works since the beginning back in '93
0
 
timonlineAuthor Commented:
ahoffmann, thanks...
forgive my ignorance, but could you tell me what "em" and "ex" refers to?
0

Featured Post

Cyber Threats to Small Businesses (Part 2)

The evolving cybersecurity landscape presents SMBs with a host of new threats to their clients, their data, and their bottom line. In part 2 of this blog series, learn three quick processes Webroot’s CISO, Gary Hayslip, recommends to help small businesses beat modern threats.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now