...

View Full Version : My Css Problem!



Undertaker
12-13-2005, 05:13 AM
Hello all! I have a website and I was wondering if I can get some help with my CSS page! I have a huge gap after my "1750" Iframe.

Is there anyway to get that -2000+ px out of there and make be at where it is?

Site: http://forever-ashley.com

Here is the CSS FILE:

body {
font: 10px arial, sans-serif;
color:#778f9d;
margin: 0px auto;
text-align: center;
background: #333740;
}

#pagebackground {
z-index: 100;
color: #778f9d;
background: #333740 url( "../images/Layout4(11-26-2005)(bottom).jpg") top repeat-y;
width: 820px;
margin: 0px auto;
}

#menu_nav {
z-index: 101;
position: relative;
top: -436px;
left: -275px;
width: 250px;
margin: 0px auto;
}
#affiliates {
z-index: 101;
position: relative;
top: -305px;
left: -10px;
width: 220px;
margin: 0px auto;
}

#affiliates .affiliate {
width: 50px;
height: 50px;
}

#affiliates .affiliate img {
border: 0px;
}

#ticker {
position: relative;
left: 260px;
top: -365px;
height: 60px;
width: 220px;
z-index: 199;
margin: 0px auto;
}

#newsticker {
text-align: center;
z-index: 199;
width: 100%;
margin: 0px auto;
}

#pagebody{
position: relative;
left: 130px;
top: -2050px;
z-index: 101;
margin: 0px auto;
width: 515px;
}

.scrollClass {
font: 10px arial, sans-serif;
background: #333740;
color: #778f9d;
}

.scrollClass a {
color: #ffffff;
background: #333740;
}

_Aerospace_Eng_
12-13-2005, 06:00 AM
When you use position:relative; the space that the element takes up will still be there which is why you have the gap. Check out this example on a proper two column layout. http://bonrouge.com/2c-hf-fixed.php
Don't abuse positioning. It only gets you into trouble.

Undertaker
12-13-2005, 06:12 AM
When you use position:relative; the space that the element takes up will still be there which is why you have the gap. Check out this example on a proper two column layout. http://bonrouge.com/2c-hf-fixed.php
Don't abuse positioning. It only gets you into trouble.

Was wondering how to make the two column layout with clicking the navagation to keep the other parts of the site up without an iframe?

_Aerospace_Eng_
12-13-2005, 06:21 AM
The closest you can get to that is to use server side includes. The includes would get cached therefore look like they aren't being reloaded. You can use javascript but this is even worse than the iframe.

ronaldb66
12-13-2005, 09:52 AM
How many pages does that site contain? Six? Why not just hard-code all six (whew!) of them? It'll make your life--and your site--a lot simpler and won't take that much work.

Undertaker
12-13-2005, 04:12 PM
No, so far I have 43 pages on my site! if u have msn or aim i could use the help!

aaroncampbell
12-13-2005, 05:14 PM
When you use position:relative; the space that the element takes up will still be there which is why you have the gap. Check out this example on a proper two column layout. http://bonrouge.com/2c-hf-fixed.php
Don't abuse positioning. It only gets you into trouble.
_Aerospace_Eng_ is right (as usual). You are WAY overusing position:relative; Make these changes to your CSS to see what I mean:
#menu_nav {
z-index: 101;
float:left;
width: 250px;
margin: -430px 0 0 10px;
}
#pagebody{
float:right;
z-index: 101;
margin: -300px 25px 0 0;
width: 515px;
}
Oh, and to help you develop CSS, you should get firefox (http://www.mozilla.com/firefox/), and the Web Dev Toolbar (https://addons.mozilla.org/extensions/moreinfo.php?application=firefox&category=Developer%20Tools&numpg=100&id=60). Then, you can edit CSS on the fly, and see the changes rendered immediately.

Undertaker
12-13-2005, 05:27 PM
thanks a bunch, i just viewed it and looks the same without the gap!



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum