Unnecessary Scrollbar

restre / 2010-08-13 03:56:37   

Hi!

I've been poking arround the css files all over... but haven't been able to get rid of a scroll that is not needed to scroll.

This is my Webpage.

I just need a little help with this.

Thx!

arsondpi / 2010-08-13 07:32:36   

The scrollbar goes away when you have no margin-top for your #content.
...once again it is advised you apply extra margins/paddings to your #menu .container and #content .container.
If these don't exist create them in you style.css and adjust things accordingly.

restre / 2010-08-13 13:23:22   

But that's the thing... If i take away the margin of my #content I won't the content aligned with my menu...

lemathieu A / 2010-08-13 13:56:38   

you will, with #menu.container and #content.container as Pindaros said.
Give it a try, he knows things ;)

restre / 2010-08-14 00:35:37   

Hooah! I will give it a go! and let ya'll know!

restre / 2010-08-14 01:15:13   

Well I've tryed numerous configurations of margins and paddins on the #menu and #content but no success :(

Since I'm not a programmer it's kinda difficult but I'm still trying to fix this...

If you guys detect the problem please lemme know! ;)

Thx!!! :)

restre / 2010-08-14 01:46:56   

Well I got it!!!! :) (sort of...)

I managed to get the content aligned with the menu.

But now my logo moves down those 30px I put, so It's not that I want just post, post and post, I just want my webpage to look just the way I want it to...

restre / 2010-08-14 01:53:12   

lol

NVM!

I finally did it!!!!

Thx Guys!!!!

U'r all awesome!

I'll post when I get this finished!!!

:)

vinmar / 2010-08-28 01:31:12   

I have tried adding and playing with margins and paddings but I cant seem to get a grip on it. Results I get are either:
_I lose the horizontal scroll bar at the menu but I mess up the text on the content
or
_I have the text set within the margin of the content but I get a horizontal scroll bar on the menu.

Thanks for your help

#menu {
width: 215px;
overflow: auto;
top: 0;
bottom: 0;
    left: 50px;
position: fixed;
height: 100%;
    background-color: #fff;
}

#menu ul {
    list-style: none;
    margin: 0 0 12px 0;
}

#menu ul li.section-title { line-height: 20pt;border-bottom-color:black;border-bottom-style:dotted;border-bottom-width:1px;color:#000000;font-size:12pt;text-align:left; }

#content {
width:864; height: 100%;
margin: 61px 0 0 275px;
top: 0;
}

.container {
line-heigh:1pt;width:864px; padding: 5px 5px 25px 5px;
}

#content p {line-height:1 pt;margin left:5px;font-size:10pt;color:#000000 width: 400px; margin-bottom: 9px; }meter

arsondpi / 2010-08-28 07:38:33   

I can't go through you code step-by-step but what will generally help you solve this one is this:

1. do not apply paddings or extra margins for #menu and #content (except the margin originaly given to #content)

2. create 2 css rules:
#menu .container { ... }
#content .container { ... }

They will allow you to create different css rules for each .container
Hope this helps...

This thread has been closed, thank you.