homepage Welcome to WebmasterWorld Guest from 54.166.10.100
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / HTML
Forum Library, Charter, Moderators: incrediBILL

HTML Forum

    
How to make the page fit to any screen size
Slik




msg:4438629
 4:34 am on Apr 9, 2012 (gmt 0)

well i work in my comp at 1920 x 1080... but when i open the page in other place thats 1024 x 768 or 1280 x 1024 it looks ugly and so big can i fix that?
im just started making that page, this part is just the "language select" i would like to fit to any screen, thanks

<html>
<head>
<title>Welcome !</title>
<link rel="icon" type="image/gif" href="animated_favicon1.gif" >
</head>
<body style="background-image:url(mcc.png);background-size:100%;background-repeat:no-repeat;">
</body
<h1><p align="left"size="20%"><a href="http://"><img src="Brazil.gif" border="0" ><img src="langbr.gif" border="0"></a></h1>
<h1><p align="left"size="20%"><a href="http://"><img src="China.gif"border="0"><img src="langch.gif"border="0"></a></h1>
<h1><p align="left"size="20%"><a href="http://"><img src="France.gif"border="0"><img src="langfrance.gif"border="0"></a></h1>
<h1><p align="left"size="20%"><a href="http://"><img src="Germany.gif"border="0"><img src="langgermany.gif"border="0"></a></h1>
<h1><p align="left"size="20%"><a href="http://"><img src="italy.gif"border="0"><img src="langitaly.gif"border="0"></a></h1>
<h1><p align="left"size="20%"><a href="http://"><img src="Spain.gif"border="0"><img src="langspain.gif"border="0"></a></h1>
<h1><p align="left"size="20%"><a href="usa.html"><img src="USA.gif"border="0"><img src="langusa.gif"border="0"> <a href="http://"><img src="trees.png" align="right"width="20%"border="0"> </a></h1>
</html>

 

incrediBILL




msg:4438646
 7:02 am on Apr 9, 2012 (gmt 0)

One way to handle restricting page size is in your CSS for a div that wraps the content areas of the page to include the following: "width:95%;max-width:1000px;" obviously replacing "1000px" with whatever size you want your page to stop expanding.

dougwilson




msg:4438685
 10:35 am on Apr 9, 2012 (gmt 0)

#1 "div that wraps the content"

also research "viewport"

"<meta name="viewport" content="device-width, initial-scale=1, user-scalable=1" />"

w3c has a mobile validation checker that will give feedback.

font-size (px, em, pt, %) will effect different resolutions. browsers etc.

lucy24




msg:4438689
 10:40 am on Apr 9, 2012 (gmt 0)

... and while you're at it, throw out that HTML editor and invest in a better one. Or do it by hand.

<h1><p align="left"size="20%"><a href="usa.html"><img src="USA.gif"border="0"><img src="langusa.gif"border="0"> <a href="http://"><img src="trees.png" align="right"width="20%"border="0"> </a></h1>

Rumor has it that google throws fits if it finds even two <h1>s on a page, let alone seven in immediate succesion. The validator will also have something to say about ... oh, lots of stuff.

This isn't as off-topic as you might think. If you want your pages to display as intended on a wide range of browsers, it's important to have HTML and CSS that follows current standards. You don't want other people's browsers to start making things up because they're unable or unwilling to do what the page is asking them to do.

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / HTML
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved