Google
HTML Tutorial


 Forum HomeForum Home   FAQFAQ   SearchSearch   MemberlistMemberlist   RegisterRegister 
 ProfileProfile   Log in to check your private messagesLog in to check your private messages   Log inLog in 
RegisterRegister - Not registered yet? Got something to say? Join HTML Code Tutorial!
Auto Scale page to fit any browser/resolution
Post new topic   Reply to topic    HTML Help Forum Index -> CSS
View previous topic :: View next topic  
Author Message
anfractuosities



Joined: 17 Apr 2008
Posts: 1
PostPosted: Thu Apr 17, 2008 2:15 pm     Auto Scale page to fit any browser/resolution Reply with quote
I am new to advanced html/css. Here is a link to my page.

http://unsend.atspace.com

Like my subject said, I would like to make my page scrolless in any browser / res. Is this possible? I don't mind black space surrounding my content.

The page is built using slices. also, How does my code look?

THanks


here is my html code
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>USAX</title>

<meta http-equiv="USAX UnSend Mail Art Exchange" content="text/html; charset=iso-8859-1" />

   <link href="css.css" rel="stylesheet" type="text/css" media="all" />



</head>

<body>

<div id="title_">

<a href="index.html"><img id="title" src="images/title.gif" width="1200" height="216" alt="" border=0;/></a>

</div>

<div id="main02_">

<img id="main02" src="images/main02.gif" width="44" height="684" alt="" />

</div>

<div id="members_">

<a href="members.html">

<img id="members" src="images/members.gif" width="243" height="62" border="0" alt="" />

</a></div>

<div id="main04_">

<img id="main04" src="images/main04.gif" width="913" height="121" alt="" />

</div>

<div id="main05_">

<img id="main05" src="images/main05.gif" width="243" height="59" alt="" />

</div>

<div id="main06_">

<img id="main06" src="images/main06.gif" width="146" height="319" alt="" />

</div>

<div id="info_">

         <a href="information.html"><img id="info" src="images/info.gif" width="257" height="36" border="0" alt="" /></a></div>

<div id="main08_">

<img id="main08" src="images/main08.gif" width="753" height="104" alt="" />

</div>

<div id="main09_">

<img id="main09" src="images/main09.gif" width="257" height="68" alt="" />

</div>

<div id="main10_">

<img id="main10" src="images/main10.gif" width="156" height="121" alt="" />

</div>

<div id="collect_">

         <a href="collet.html"><img id="collect" src="images/collect.gif" width="261" height="52" border="0" alt="" /></a></div>

<div id="main12_">

<img id="main12" src="images/main12.gif" width="593" height="459" alt="" />

</div>

<div id="main13_">

<img id="main13" src="images/main13.gif" width="261" height="69" alt="" />

</div>

<div id="main14_">

<img id="main14" src="images/main14.gif" width="77" height="94" alt="" />

</div>

<div id="postman_">

         <a href="post.html"><img id="postman" src="images/postman.gif" width="209" height="48" border="0" alt="" /></a></div>

<div id="main16_">

<img id="main16" src="images/main16.gif" width="131" height="338" alt="" />

</div>

<div id="main17_">

<img id="main17" src="images/main17.gif" width="209" height="46" alt="" />

</div>

<div id="main18_">

<img id="main18" src="images/main18.gif" width="48" height="244" alt="" />

</div>

<div id="future_">

         <a href="future.html"><img id="future" src="images/future.gif" width="195" height="52" border="0" alt="" /></a></div>

<div id="main20_">

<img id="main20" src="images/main20.gif" width="189" height="244" alt="" />

</div>

<div id="main21_">

<img id="main21" src="images/main21.gif" width="195" height="192" alt="" />

</div>

<div id="hungry_">

<img id="hungry" src="images/hungry.gif" width="595" height="738" alt="" />

</div></body>

</html>


and here is my css

Code:

body {

color: #DDD;

font-family: "Courier New", Courier, Monaco, monospace;

background-color: #000;

text-align: left;

font-size: 14pt;

font-weight: 600;

border=0;

}

a:link {

color: white;

text-decoration: none;

}



a:visited {

color: white;

text-decoration: none;

}



a:hover {

color: white;

text-decoration: none;

}



a:active {

color: white;

text-decoration: none;

}



#title_ {

position:absolute;

left:0px;

top:0px;

width:1200px;

height:216px;

}



#main02_ {

position:absolute;

left:0px;

top:216px;

width:44px;

height:684px;

}



#members_ {

position:absolute;

left:44px;

top:216px;

width:243px;

height:62px;

}



#main04_ {

position:absolute;

left:287px;

top:216px;

width:913px;

height:121px;

}



#main05_ {

position:absolute;

left:44px;

top:278px;

width:243px;

height:59px;

}



#main06_ {

position:absolute;

left:44px;

top:337px;

width:146px;

height:319px;

}



#info_ {

position:absolute;

left:190px;

top:337px;

width:257px;

height:36px;

}



#main08_ {

position:absolute;

left:447px;

top:337px;

width:753px;

height:104px;

}



#main09_ {

position:absolute;

left:190px;

top:373px;

width:257px;

height:68px;

}



#main10_ {

position:absolute;

left:190px;

top:441px;

width:156px;

height:121px;

}



#collect_ {

position:absolute;

left:346px;

top:441px;

width:261px;

height:52px;

z-index: 3;

}



#textbox_ {

position:absolute;

left:620px;

top:207px;

width:580px;

height:693px;

z-index: 3;

}



#main12_ {

position:absolute;

left:607px;

top:441px;

width:593px;

height:459px;

}



#main13_ {

position:absolute;

left:346px;

top:493px;

width:261px;

height:69px;

}



#main14_ {

position:absolute;

left:190px;

top:562px;

width:77px;

height:94px;

}



#postman_ {

position:absolute;

left:267px;

top:562px;

width:209px;

height:48px;

}



#main16_ {

position:absolute;

left:476px;

top:562px;

width:131px;

height:338px;

}



#main17_ {

position:absolute;

left:267px;

top:610px;

width:209px;

height:46px;

}



#main18_ {

position:absolute;

left:44px;

top:656px;

width:48px;

height:244px;

}



#future_ {

position:absolute;

left:92px;

top:656px;

width:195px;

height:52px;

}



#main20_ {

position:absolute;

left:287px;

top:656px;

width:189px;

height:244px;

}



#main21_ {

position:absolute;

left:92px;

top:708px;

width:195px;

height:192px;

}



#hungry_ {

position:absolute;

left:482px;

top:162px;

width:595px;

height:738px;

}

Corey Bryant
Site Admin


Joined: 15 May 2004
Posts: 8205
Location: Castle Rock CO USA
PostPosted: Sat Apr 26, 2008 1:34 pm     Reply with quote


It looks like you are using absolute positioning which will cause you some problems with the "design".

You should look into allowing the elements land in the browser as it is loaded and not specify the position.

_________________
Corey
Hosting Solutions | Mile High Merchant Accounts | Expression Web Blog
Display posts from previous:   
Post new topic   Reply to topic    HTML Help Forum Index -> CSS All times are GMT - 8 Hours
Page 1 of 1

 
Jump to:  
You cannot post new topics in this forum
You cannot reply to topics in this forum
You cannot edit your posts in this forum
You cannot delete your posts in this forum
You cannot vote in polls in this forum
HTML Help Archive
Powered by phpBB © 2001, 2005 phpBB Group
HTML Help topic RSS feed 
 
HOSTING / DESIGN
$1.99 Domain Registration
Cheap Web Hosting
Website Templates
MAKE MONEY
Sell Domain Names
Sell Website Templates

Home   |   Tutorials   |   Forum   |   Quick List   |   Link Directory   |   About
Copyright ©1997-2002 Idocs and ©2002-2007 HTML Code Tutorial