Jump to content

DreamTwist

Members
  • Posts

    4
  • Joined

  • Last visited

DreamTwist's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. Yes! I think that pretty much fixes it. My last problem being the fact that one of my six links are cuttoff on my personal screen, which is smaller than the screen I made it on. How can I make the page resize (I know this is probably very basic) to smaller screens?
  2. Yes! Sorry, I forgot to include the images. But yea, that's a good set of replacements. Anyway, you see how when you resize the browser, the picture of mars comes in from the right to cover up the earth? How can I fix that?
  3. I'm having some trouble getting this picture of mars and the main links surrounding it to be positioned correctly. I've surfed the web for hours trying to find a solution, but I just can't. I assume it's something to do with the css and they way I've declared their positions, but I can't pinpoint it exactly. I've tried using both absolute, fixed, relative positioning, and changing the offsets from percentages to pixels and everything like that (including setting the overflow to scrolled and hidden etc), but still no luck. It looks fine on my monitor, but when I go to another computer or resize my browser, it acts up in unwanted ways. Can anyone help? Relevant HTML: <html><head><link type="text/css" href="main.css" rel="stylesheet"><script type="text/javascript" src="main.js"></script></head><body><h1>Generic Welcome Message Here</h1><img id="earth" src="images/globe.gif" width="150" height="150" alt="globe.gif" /><img id="mars" src="images/mars.png" width="800" height="800" alt="mars.png" /><!--Navigation Bar --><a id="indexNav" href="index.html">Home</a><a id="aboutUsNav" href="aboutUs.html">About Us</a><a id="coverageNav" href="coverage.html">Coverage</a><a id="productsNav" href="products.html">Product Info</a><a id="ordersNav" href="orders.html">Inquiries-Orders</a><a id="contactUsNav" href="contactUs.html">Contact Us</a><a id="supportNav" href="support.html">Support</a><p id="footer">Copyright ©2014 Generic Title, All rights reserved</p></body></html> Here is my CSS for the entire page: body {overflow:hidden;background-image:url("images/space.jpg");}#earth {position:absolute;padding:0;left:200px;top:150px;}#mars {position:absolute;padding:0;right:-200px;}h1 {font:Palatino Linotype;color:white;text-decoration:underline;text-align:center;}p {font:"Times New Roman";font-size:20px;color:white;}#footer {position:fixed;bottom:-10px;right:5px;background::#355E95;font-size:15px;font-style:italic;}/*Navigation link section for homepage*/#indexNav{position:absolute; top:150px; right:400px; z-index:2; font-size:30px; color:white;}#aboutUsNav{position:absolute; top:250px; right:450px; z-index:2; font-size:30px; color:white;}#coverageNav{position:absolute; top:350px; right:500px; z-index:2; font-size:30px; color:white;}#productsNav{position:absolute; top:450px; right:550px; z-index:2; font-size:30px; color:white;}#ordersNav{position:absolute; top:550px; right:500px; z-index:2; font-size:30px; color:white;}#contactUsNav{position:absolute; top:650px; right:450px; z-index:2; font-size:30px; color:white;}#supportNav{position:absolute; top:750px; right:400px; z-index:2; font-size:30px; color:white;}
×
×
  • Create New...