Cant remove some strange padding

  • pedrotuga
  • Proficient
  • Proficient
  • User avatar
  • Posts: 315

Post 3+ Months Ago

Hey there, I am going through a really frustrating problem.

I want to add an horizontal navigation bar to an SMF theme.
It got almost done but there is some annoying padding that i can't remove.
I need help from a somebody with proper CSS knowledge, I suck at CSS.

Here's my test instaltion of SMF:
http://pedro.dreamhosters.com/smf/

As you can see the navigation bar is not right on top of the page. There s a gap. I tried to remove that gap by using absolute positioning and it kind of worked (not really), the bar itself went to the right place, but then the didn't.

Any help would be appreciated.
  • neksus
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 2194
  • Loc: Canada

Post 3+ Months Ago

Code: [ Select ]
#navmenu
{
        margin: 15px 0px 8px 0px;
        padding: 0;
        text-align: center;
}
  1. #navmenu
  2. {
  3.         margin: 15px 0px 8px 0px;
  4.         padding: 0;
  5.         text-align: center;
  6. }


Should be
Code: [ Select ]
#navmenu
{
        margin: 0px 0px 8px 0px;
        padding: 0;
        text-align: center;
}
  1. #navmenu
  2. {
  3.         margin: 0px 0px 8px 0px;
  4.         padding: 0;
  5.         text-align: center;
  6. }


The former has top-margin 15px.
  • pedrotuga
  • Proficient
  • Proficient
  • User avatar
  • Posts: 315

Post 3+ Months Ago

Nexus, thanks for the help.
But you got mixed up in the code, maybe I was not 100% clear.
I was talking about the top navigation bar which is not #navmenu.

I added a CSS file to the theme in order to keep styles a bit tidy.
http://pedro.dreamhosters.com/smf/Theme ... navbar.css

But something in the main CSS file is screwing things up.
I thought it would be the body padding, but i already removed and the problem is still there.
  • neksus
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 2194
  • Loc: Canada

Post 3+ Months Ago

Sorry about that, I just assumed you were trying to move the bar I posted :)

CSS Code: [ Select ]
#navlist ul{
   /* position:absolute; top:0px; */
   margin-top: 0px;
   line-[b]heigth[/b]: 22px;
}
 
  1. #navlist ul{
  2.    /* position:absolute; top:0px; */
  3.    margin-top: 0px;
  4.    line-[b]heigth[/b]: 22px;
  5. }
  6.  


Spelling mistake ;)

Also, have you tried putting a margin: 0 in your navcontainer?

Post Information

  • Total Posts in this topic: 4 posts
  • Users browsing this forum: No registered users and 19 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.