Anonymous
Unregistered
Posted 7 years ago #
I'm trying to make everything fit im my page, so that there's no scrollbar on the side of the browser. The "(c)2004 cynikalsam.com" credit is too low, making you have to scroll down to see it. How do i move it up, so that it's right under the blog, and in view, so no scrolling is neccisairy?
http://www.cynikalsam.com/blog
Anonymous
Unregistered
Posted 7 years ago #
Its like this; There's so much blank space under the blog, that if i can just move the "(c)2004 cynikalsam.com" up under the blog, there'd be no need for scrolling from the browser. Look at my link, you'll see what i mean..
What's the
top: 1000px;
doing in your 'credit' and 'cite' ?
But you could also try to put that code before your last </div>
Anonymous
Unregistered
Posted 7 years ago #
Oh, that was me just adding random stuff to see if i could affect the position of the credit. Needless to say it didnt work, and i ment to delete it. I'll try your suggestion now
I haven't looked at the css or xhtml in any detail but I think it may be to do with the fact that your menu is relatively positioned, I would guess that the gap under your content is the same height as your menu. Basically the menu is within the flow of the page and is extending the overall height accordingly, however when you reposition it (top:-450px) then it appears where you want but in context to the html it is still causing the overflow.
Since your content is set to be a fixed size you could probably get away with absolutely positioning the menu. Of course this could cause problems if people resize text but so do most designs potentially.
Anonymous
Unregistered
Posted 7 years ago #
How do i do that? I know that stuff is positioned reletivly (i've seen it in the css) do i change "relative" to "absolute" or what? Then what do i edit to make the blank space go away?
Anonymous
Unregistered
Posted 7 years ago #
Ok, i managed to move the "©2004 cynikalsam.com" up to where it needs to be, so now all i have to to is get rid of all that empty space below my forum.. Any idea how to do that?
Anonymous
Unregistered
Posted 7 years ago #
Well forgive me for mentioning it but two completely different sets of (x)html with two different DTDs on one page are not helping.
Anonymous
Unregistered
Posted 7 years ago #
lol I dont know what that means! *bangs head on wall* lol PLease, can sombody tell me what i need to do? Is it going to be impossible for me to do if i dont know how to code? If it is, just tell me and i'll leave it how it is..
You've effectively got 2 different pages in one.
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" "http://www.w3.org/TR/html40/loose.dtd">
is at the top,
then under the flash banner, you have
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Basically the page is trying to get the browser to act in 2 ways, and it can't.
A webpage should have only one of the following tags:
<html>
<head>
<title>
<body>
and one of the corresponding 'off tags ( </html> )
I would suggest this:
- Cut the whole flash banner out. Remove everything above
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- From the part you just cut out, keep only the part that starts and end with the 'object' tags.
- Paste this new bit in right underneath the <body> tag.
That should solve the 'two pages in one' bit, and will mean that when we look at the page, we can be more confident in helping.
A page that has errors, even if we suggest a fix for one, may cause other effects due to other errors - that's why fixing a page first is the way to go.
Keep posting - we'll keep helping :)
(And what was the image error about ? Did you find out ?)
Anonymous
Unregistered
Posted 7 years ago #
I did what you suggested podz, but not the banner is leaning toward the left.. What should i do next?
PS; Good eye moshu! lol :)
Try this:
Cut this line out
<div id="rap">
and place it between <body> and the object line.
Should be
body
rap
object
in that order.
This is a bit odd:
#rap {
position: relative;
margin: -5px 10% 10px 10%;
Try this instead of those two lines:
#rap {
margin: -5px auto 10px auto;
I'm not sure about the -5px, but where it is it doesn't matter for now.
Anonymous
Unregistered
Posted 7 years ago #
OK i did that, but now the banner is too far right, and the "(c)2004 cynikalsam.com" has moved up into the body of my blog..
Anonymous
Unregistered
Posted 7 years ago #
Oh i didnt see your last reply before i posted. I'll do that now.
Ack ... just seen the flash code:
width="900" height="130"
So putting in #rap may not work.
If the above does not get things right, we'll need a bit more css.
Take the extra
#rap { <---it's just those bits.
out :)
#rap {
margin: -5px auto 10px auto;
width:790px;
height: 450px;
background-image: url("bg.jpg");
background-repeat:no-repeat;
background-position:top;
}
Anonymous
Unregistered
Posted 7 years ago #
It was looking good? Are you using IE? I was looking at it in firefox and its all off center and the bg image wont load.. I had to upload my old css after changing the
#rap {
margin: -5px auto 10px auto;
Because it got rid of basically all the layout.
Do you have IM ?
I could help through that if you want ?
Anonymous
Unregistered
Posted 7 years ago #
Sure. cynikalsam @ hotmail.com
Thanks
Anonymous
Unregistered
Posted 7 years ago #
It still looks all weird. Stuff like the position of the background image is too high, and the banner is too right, and the copywright is in the body of the main txt.. lol I hope i did it right
Anonymous
Unregistered
Posted 7 years ago #
I just looked in IE, and the banner is center there, but it's off center in Firefox.. :/
Okay ... what's happening is this:
The banner is 900px wide, but the rap is 790px.
The banner is being correctly aligned on the left, but it is sticking out of the right side.
There are two ways around it.... let's go for this way:
<div id="rap">
Move that to just above <h1 id="header">
That leaves the banner with no css, and it will move all the way left.
So.......
In your css, add this:
#banner {
width:900px;
margin:0 auto;
}
Then, in index.php, put
<div id ="banner"> just before the first object tag
and
</div> after the last object tag.
I think that will work.
<div id ="banner">
Take the space out
<div id="banner">
Anonymous
Unregistered
Posted 7 years ago #
Yep that fixed it a lot! Now there's just the matter of the "blank space" under everything..
There is yes..... and right now, I can't see the cause.
There are some small validation errors (apart from the flash ones) but I don't think they will affect the height.....
If no-one else pops along, I'll have a better look later in the morning - it's 01:17am here Z z z z z z z :)
Anonymous
Unregistered
Posted 7 years ago #
Ok thanks for all your help! :)