I have read the tutorials I have searched the forum nothing could help me with this! This is a page that has absolute positions vertically put percentages horizontally. Because I am a strong believer that if a user sees a verticle scroll bar they will think its ok. But a horizontal scrollbar gos to far. Well in Internet explorer 6 it does what I want. Everything fits into a nice small window. Also it doesnt waste any screen space in a large window.Heres a linkIn Firefox (FF) It just displays my image in a yellow blob. Heres the HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html> <head> <meta name="description" content="Website about dundas district me and my freinds" /> <meta name="keywords" content="Dundas, Josh, Fun, Cool," /> <meta name="developer" content="Josh Bradshaw" /> <meta name="rating" content="general" /> <meta name="author" content="Josh Bradshaw" /> <title>♫Sax World♫</title> <!--functions script--> <script type="text/javascript"> //key to background changer function change() { document.bgColor=document.list.colors.options [document.list.colors.selectedIndex].value; } function style() { document.getElementById("style").background.backgroundColor=document.list.colors.options [document.list.colors.selectedIndex].value; } </script> <!-- end functions script--> <!--place stylesheet links here--> <link href="http://www.freewebs.com/gamestrats/music_note.ico" type="image/x-icon" rel="shortcut icon"/> <link rel="stylesheet" type="text/css" href="http://saxworld.awardspace.com/css/home.css" /> <!--end place stylesheet links here--> </head> <body> <!--Big title--><div class="centerim"> <img alt="title" src="http://www.freewebs.com/gamestrats/saxworldbetterbanner.gif" width="468px" height="60px" /> </div> <!--end title--> <!--iframe--> <div class="frame"> <iframe class="blog" frameborder="0" name="blog" scrolling="auto" src="http://saxworld.awardspace.com/welcome.html">Your Browser does not support Iframes or does not have Iframes enabled Upgrade it to view my blog!!!!My personal suggestion is <a href="http://www.mozilla.com/">Get Firefox</a> Or you may have them turned off. </iframe> </div> <!--end iframe--><!--Left menu--><div class="left"><b>My Site</b><br /><hr /><!--remember page break tags--><a href="http://saxworld.awardspace.com/welcome.html" target="blog">Home</a><br /><a href="http://saxworld.awardspace.com/message.html" target="blog">Message Boards</a><br /><a href="http://saxworld.awardspace.com/comment.html" target="blog">Contact</a><br /><a href="http://saxworld.phpbbnow.com/" target="_blank">My forum</a><br /><a href="http://saxworld.awardspace.com/faq.html" target="blog">FAQ</a><br /><a href="http://saxworld.awardspace.com/Guestlog.htm" target="blog">Guest Book</a><br /><a href="http://saxworld.awardspace.com/sitemap.html" target="blog">Site Map</a><br /> <a href="http://saxworld.awardspace.com/credits.html" target="blog">Credits</a><br /><a href="http://saxworld.awardspace.com/school.html" target="blog">School</a><br /><a href="http://saxworld.awardspace.com/news.html" target="blog">News</a><br /><a href="http://saxworld.awardspace.com/about.html" target="blog">About me</a><br /><a href="http://saxworld.awardspace.com/links.html" target="blog">Links</a><br /><a href="http://saxworld.awardspace.com/reflex.html" target="blog">Reflex tester</a><br /><a href="http://saxworld.awardspace.com/sitemap.html" target="blog">Site Map</a><br /><hr /></div><!--end left menu--><!--right menu--><div class="right"><b>Blog Entries</b><br /><hr /><!--remember page break tags--><a href="http://saxworld.awardspace.com/Blog/entry13.html" target="blog">Day 13</a><br /><a href="http://saxworld.awardspace.com/Blog/entry12.html" target="blog">Day 12</a><br /><a href="http://saxworld.awardspace.com/Blog/Entry11.html" target="blog">Day 11</a><br /><a href="http://saxworld.awardspace.com/Blog/entry10.html" target="blog">Day 10</a><br /><a href="http://saxworld.awardspace.com/Blog/Entry9.html" target="blog">Day 9</a><br /><a href="http://saxworld.awardspace.com/Blog/Entry8.xml" target="blog">Day 8</a><br /><a href="http://saxworld.awardspace.com/Blog/entry7.xml" target="blog">Day 7</a><br /><a href="http://saxworld.awardspace.com/Blog/Entry6.html" target="blog">Day 6</a><br /><a href="http://saxworld.awardspace.com/Blog/Entry5.html" target="blog">Day 5</a><br /><a href="http://saxworld.awardspace.com/Blog/entry4.html" target="blog">Day 4</a><br /><a href="http://saxworld.awardspace.com/Blog/Entry3.html" target="blog">Day 3</a><br /><a href="http://saxworld.awardspace.com/Blog/entry2.html" target="blog">Day 2</a><br /><a href="http://saxworld.awardspace.com/Blog/Entry1.html" target="blog">Day 1</a><br /><br /><hr /></div><!--end right menu--><div class="form"> <!--way this works: action is the change color statement in head. submit submits the option to the action then action to the function--> <form name="list" action="java script:change()"> <!--Start Drop down list here --> <select name="colors"> <option value="red">Red </option> <option value="blue">Blue</option> <option value="green">Green </option> <option value="orange">Orange </option> <option value="white">White</option> <option value="#00FFFF">Cyan</option> <option value="#000000">Black</option> <option value="#7FFFD4">Aqua</option> <option value="#FFD700">Gold</option> <option value="#1E90FF">Dodger blue</option> <option value="#8B0000">Dark Red</option> <option value="#9ACD32">YellowGreen</option> <option value="#COCOCO">Silver</option> <option value="#008B8B">Dark Cyan</option> <option value="#B22222">Fire Brick</option> <option value="#000080">Navy</option> <option value="#87CEEB">Sky Blue</option> <option value="#00CED1">Dark Turquoise</option> <option value="#00FF00">Lime</option> <option value="#ADFF24">GreenYellow</option> </select> <!-- end drop down list--><input type="submit" value="Change Background color" /></form><!--valid info--><a class="w3c" href="http://validator.w3.org/check?uri=http%3A%2F%2Fsaxworld.awardspace.com%2Findex.html"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a> <a class="w3c" href="http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fsaxworld.awardspace.com%2Fcss%2Fhome.css&usermedium=all"> <img style="border:0;width:88px;height:31px" src="http://www.freewebs.com/gamestrats/vcss.png" alt="Valid CSS!" /></a> <!--end valid info--></div></body></html>
Heres the Css
a{float:left;width:7em;text-decoration:none;color:blue;background-color: yellow;padding:0.1em 0em;}a:link{color:blue;text-decoration: none;background-color: yellow;}a:visited{float:left;width:7em;text-decoration:none;color: red;background-color: yellow;padding:0.1em 0em;}a:hover{color: yellow;text-decoration: underline;background-color:red;}a:active{color: blue;text-decoration: none;}iframe.blog{width: 700px;height: 500px;position: absolute;top: 0px;left: 0px;}.frame{border-style: solid;border-color: black;border-width: 6px;position:absolute;left: 133px;top: 125px;width: 700px;height: 500px;}.left{background-color:yellow;position: absolute;top: 125px;left: 5px;height: 500px;width: 125px;}.right{background-color:yellow;position: absolute;top: 125px;left: 847px;width: 125px;height: 500px;overflow:auto;}.form{position:absolute;top: 640px;left: 5px;background-color:yellow;width: 972px;height: 60px;}.valid{position: absolute;top:640px;left: 605px;background-color: yellow;height: 90px;z-index:1;width:372px;}a.w3c:link{background-color:yellow;color:white;text-decoration: none;z-index: 5;}a.w3c:visited{color:white;background-color:yellow;text-decoration: none;}a.w3c:hover{background-color:yellow;color: white;text-decoration: none;}a.w3c:active{color:white;background-color:yellow;text-decoration: none;}/*heres is the top image*/.centerim{position:absolute;left:200px;width:470px;height:62px;border-width:5px;border-style:solid;border-color:black;}
heres a screen shot of it in FF:Edit:Screen shot removed. was far to large. Problem the screenshot was displaying is resolved anywaysorry if I have talked about this problem way to much it is driving me crazy. Thanks in advance,Snowboard01.
