Runboard.com
Слава Україні!
Lost? Hover on Bookmarks!
Runboard Extra! The Runboard Directory Runboard Knowledge Base

Welcome to Runboard Support, the place to find help with your Runboard user account or message board.

If you can't find the answer you need with our search feature, ask here, and a member of staff will respond to you personally.

Chat room Runboard Knowledge Base (wiki) Search Facebook Twitter

runboard.com       You are not logged in.

Page:  1  2  3 ... 5  6  7 

 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Runboard staff member

Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
Reply | Quote
Getting Nav Bar To Lay Flat


Okay. I took Lesa's code from one board to use on one of mine. I googled and tweaked it to do what I wanted ... but this added a space I don't want. I can't find the fix. HELP! How do I get the space under the nav bar to go away?

http://btwilighttestboard.runboard.com/

My Tweak:

I added: width:80%; margin-left:auto; margin-right:auto; ... switched out colors and such, and I'm quite pleased with myself. Just frustrated I can't figure out the right search words to get the info I want on the added space.


/* NAVIGATION LINKS AT TOP */

#nav {
   width:80%; margin-left:auto; margin-right:auto; padding: 0; text-align: center; font-weight: bold;
   border: solid #bb8866; border-width: 0 1px;
   background: #443322 center;
}
#nav li { display: inline; margin: 0; padding: 0.3em 0; list-style: none; position: relative; }
#nav a:link, #nav a:visited, #nav a:hover { color: #ddcc99; text-decoration: none; padding: 0 1em; }

/* FORUM SUB-MENUS */
#nav ul { display: none; }
#nav li:hover ul {
     display: block; background: #ccaa77;
     border: 1px solid #bb8866;
     position: absolute; top: 1.5em; left: 0;
     text-align: left; white-space: nowrap;
    -moz-box-shadow: 2px 2px 7px #bb7733;
    -webkit-box-shadow: 2px 2px 7px #bb7733;
    box-shadow: 2px 2px 7px #bb7733;
    filter:
        progidemoticonXImageTransform.Microsoft.Shadow(color=#bb7733,direction=135,strength=5);
}
#nav ul, #nav li li { margin: 0; padding: 0; list-style: none; }
#nav li li { display: block; }
#nav ul a:link, #nav ul a:visited, #nav ul a:hover { color: #775522; }
#nav li li:hover { background: #ffcc77; }



You need to change emoticon to :yay: emoticon


---

1/2/2014, 1:04 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Lesigner Girl Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Head of Runboard staff

Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


By "added space," do you mean how your navbar is wider than everything else at certain resolutions?

I see you have this in your CSS:


@media (min-width: 1024px) {

   .ak_msg_master_table { width: 974px; }

...
}


But you also have #nav set at 80% no matter what the browser's width is. When my browser is maximized, this makes #nav wider than ak_msg_master_table, but when I make my window narrower, ak_msg_master_table can be wider than #nav because 974px is wider than 80% of my browser's width when the browser's width is narrow.

Personally, I would put a <div> around the whole board. I normally give this the id of "container", but it's up to you. Then, I would apply a width this container div (possibly depending on resolution, if you want), give ak_msg_master_table a width of 100% no matter what the resolution is, and let #nav keep its default width (100%) without actually defining that width.

---
Runboard Knowledge Base
Runboard Support Forums
Find other message boards
1/2/2014, 3:59 am Link to post Email Lesigner Girl   PM Lesigner Girl Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Runboard staff member

Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


The "Themed Forum" bar was the whole width of the board, and the 80% fixed it. (For me, in Firefox) But, now the bar no longer sits on top of the inner table.

It did before I tweaked anything.








Last edited by Joxcenia, 1/2/2014, 4:19 am


---

1/2/2014, 4:12 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Lesigner Girl Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Head of Runboard staff

Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


Concerning the width, your browser doesn't matter in this case. What matters is the width of your browser. If you re-size your browser window, you might see what I mean.

As for the gap below #nav, <ul> tags automatically have a top and bottom margin by default, so you need to set the bottom margin to 0 to get rid of that bottom gap.

---
Runboard Knowledge Base
Runboard Support Forums
Find other message boards
1/2/2014, 4:41 am Link to post Email Lesigner Girl   PM Lesigner Girl Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Runboard staff member

Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


I'm not sure we're talking about the same thing. When you say 100%, does that mean the board goes back to the way I had it before? Like this width?

http://btheillusivemuse.runboard.com/

I like the width of your code that Susa gave me. I just want the "Themed" bar to lay on top of the inner table.

<doh> I guess you mean like Whoosh? I prefer the width I have now ... but the <div> thing sounds okay. You're the expert, so I trust your opinion. (BTW: I was peaking in the h/f at Whoosh ... and I made changes to the links in the footer ... and I may have messed up the header. (Not sure.) I had so many tabs open, with a number of board control panels in play ... I may have goofed up something.

My brain's fried right now, and I need to get in the shower. Gotta get up early for my mammo exam. Fun. I'll save what I have to a thread, and you can play with the CSS/HTML if you want. Not that you have to. You can probably see where I'm going and get there before I do. emoticon


I could have sworn I had all of that code saved somewhere, but I can't find it. I don't think you had the bar at the very top ... but for some reason I have it in my head that you did, and I deleted it. It's been nagging me all day.

Ok. Off to make one more round, and then off to the shower I go. Maybe I'll be more refreshed tomorrow. Get a fresh start on all of this.

Laters.





---

1/2/2014, 4:57 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Runboard staff member

Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


You posted when I was writing mine. ... So, I'll get to this tomorrow. I don't mind you playing with it. I just don't want you to feel like you have to.

Thanks for your patience with my newbie mentality. emoticon Maybe it'll all make sense later. It sometimes jumps out at me once I take a step back.

Hope you're having a happy new year!

Night.





---

1/2/2014, 5:00 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Runboard staff member

Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


Okay. I was still playing ... but I'm done now.


All of the margins I saw were at 0. I could have corrupted the code while I was tweaking it though. But it will have to wait.





---

1/2/2014, 5:12 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Lesigner Girl Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Head of Runboard staff

Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


Key phrase: All of the margins you saw. I didn't see a top margin for <ul id="nav">, so the default margin would have left a gap.

---
Runboard Knowledge Base
Runboard Support Forums
Find other message boards
1/2/2014, 5:19 am Link to post Email Lesigner Girl   PM Lesigner Girl Blog
 
Joxcenia Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Runboard staff member

Registered: 11-2005
Location: Whoosher House
Posts: 7810
Karma: 74 (+75/-1)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


Okay. Thanks. Getting off for sure now. Night.

---

1/2/2014, 6:22 am Link to post Email Joxcenia   PM Joxcenia Blog
 
Lesigner Girl Profile
Live feed
Blog
Friends
Miscellaneous info

Global Administrator
Head of Runboard staff

Registered: 11-2005
Posts: 26740
Karma: 436 (+489/-53)
Reply | Quote
Re: Getting Nav Bar To Lay Flat


Sleep well. emoticon Hopefully we'll both think more clearly tomorrow, lol.

---
Runboard Knowledge Base
Runboard Support Forums
Find other message boards
1/2/2014, 8:18 am Link to post Email Lesigner Girl   PM Lesigner Girl Blog
 


Add a reply

Page:  1  2  3 ... 5  6  7 



You are not logged in (login)