Wordpress Themes - WP Forum at BFA
Click here to register or to donate.
Auto self-registration is not available here - far too many spammers. This forum has many, many backlinks and because of that there is an intense desire among spammers to drop their links here.

Wordpress Themes - WP Forum at BFA » WordPress Themes » Atahualpa 3 Wordpress theme » Header configuration & styling »

menu bar and link area: different heights


  #1  
Old Mar 26, 2013, 09:23 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Can you please tell me how do I solve this difference between the menu bar and the "link area"??? I tried to change every padding and margin options but's not working :/ Please, see attached a print screen. Thank you
Attached Thumbnails
Click image for larger version

Name:	doubt.png
Views:	394
Size:	41.4 KB
ID:	2291  
  #2  
Old Mar 26, 2013, 09:28 AM
juggledad's Avatar
juggledad
 
23,571 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
This was just answered a couple days ago, check the forums
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #3  
Old Mar 26, 2013, 09:48 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Sorry juggledad but I'm not finding specifically what I need..have u got an idea of what was the title of the tread, key words, tags???
  #4  
Old Mar 26, 2013, 11:48 AM
juggledad's Avatar
juggledad
 
23,571 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Ok, I'm going to make you work for it.
Install the FireBug extension of FireFox and use the inspector to examine the area in question.
What HTML and CSS do you see?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #5  
Old Mar 26, 2013, 12:25 PM
jcpcosta
 
32 posts · Oct 2012
Portugal
I assure you I tried to find it

I did that before too..but I'm kind of a newbie! So, I appreciate your help even more I didn't know Firebug. I use Chrome so thank you for showing me this debugging which is much more simple and easy to read!

So the HTML is:

<body class="home page page-id-2 page-template-default">
<div id="wrapper">
<div id="container">
<table id="layout" cellspacing="0" cellpadding="0" border="0">
<colgroup>
<col class="coltwo">
</colgroup>
<tbody>
<tr>
<td id="header" colspan="1">
<div id="header1" class="bfa_widget_area">
<div id="widget_sp_image-2" class="widget widget_sp_image">
<img class="attachment-full" width="800" height="111" src="http://protocolos.mdsinsure.com/redunicre/files/2013/03/redunicre.png" style="max-width: 800px;max-height: 111px;" alt="">
</div>
</div>
<div class="horbar1"> </div>
<div id="menu1">
<ul id="rmenu2" class="clearfix rMenu-hor rMenu">
<li class="page_item page-item-2 current_page_item">
<a href="http://protocolos.mdsinsure.com/redunicre/">
<span>Home</span>
</a>
</li>
<li class="page_item page-item-23">
<a href="http://protocolos.mdsinsure.com/redunicre/subscricao-mr-comercio-servicos/">
<span>Subscrição MR Comércio & Serviços</span>
</a>
</li>
<li class="page_item page-item-25">
<a href="http://protocolos.mdsinsure.com/redunicre/subscricao-acidentes-de-trabalho/">
<span>Subscrição Acidentes de Trabalho</span>
</a>
</li>
</ul>
</div>
</td>
</tr>

And the style is:


.clearfix:after {
clear: both;
content: ".";
display: block;
height: 0;
visibility: hidden;
}
div#menu1 ul.rMenu {
background: none repeat scroll 0 0 #D1D0D0;
border: 1px none #D1D0D0;
}
ul.rMenu-hor {
padding-left: 1px;
}
ul.rMenu, ul.rMenu li, ul.rMenu ul {
list-style: none outside none;
}
ul.rMenu, ul.rMenu ul, ul.rMenu li, ul.rMenu a {
display: block;
margin: 0;
padding: 0;
}
.clearfix {
display: block;
min-width: 0;
}
ul, ol, dl, p, h1, h2, h3, h4, h5, h6 {
margin-bottom: 10px;
margin-top: 10px;
padding-bottom: 0;
padding-top: 0;
}

  #6  
Old Mar 26, 2013, 02:42 PM
juggledad's Avatar
juggledad
 
23,571 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
Go put a border on 'menu1'
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support

Last edited by juggledad; Mar 26, 2013 at 04:38 PM.
  #7  
Old Mar 26, 2013, 04:17 PM
jcpcosta
 
32 posts · Oct 2012
Portugal
Doesn´t work! I tried adding

div#menu1 ul.rMenu {
border: 5 none #D1D0D0;
}

in the CSS inserts --> ATO

Then in ATO -->Style and edit header area--> both borders of hor bars..

Stills the same :/
  #8  
Old Mar 26, 2013, 04:27 PM
juggledad's Avatar
juggledad
 
23,571 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
so you put a border on the ul that is a child of the element which has the ID 'menu1'
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #9  
Old Mar 27, 2013, 09:14 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Didn't work out too
  #10  
Old Mar 27, 2013, 10:41 AM
juggledad's Avatar
juggledad
 
23,571 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
sorry, I had a head cold yesterday and rereading what I wrote even 'I' can't understand it.

what I wanted to say is you put the border on the <ul> which is a child of the <div> with the class 'menu1' - put the border on the div
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #11  
Old Apr 1, 2013, 08:48 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Hi!

Still doesn't work....
  #12  
Old Apr 1, 2013, 10:58 AM
juggledad's Avatar
juggledad
 
23,571 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
What did CSS you use and where did you put it?
__________________
"Tell me and I forget, teach me and I may remember, involve me and I learn." - Benjamin Franklin
Juggledad | Forum Moderator/Support
  #13  
Old Apr 1, 2013, 11:24 AM
lmilesw's Avatar
lmilesw
 
10,174 posts · Jul 2009
Central New York State USA
The CSS you mentioned earlier is

HTML Code:
div#menu1 ul.rMenu {
border: 5 none #D1D0D0;
}
Here is a test... What does "border: 5 none #D1D0D0" mean?
__________________
~Larry (CNY Web Designs)
This site should be a membership site since it so full of good stuff.
Please consider donating which gives you access to even more good stuff.

Last edited by juggledad; Apr 1, 2013 at 11:26 AM.
  #14  
Old Apr 24, 2013, 10:00 AM
jcpcosta
 
32 posts · Oct 2012
Portugal
Sorry for my late answer...well now you set me up :P I'm a CSS newbie but let's see:

border: 5 none #D1D0D0;

- 5 should be the border... but I guess "px" is missing, no?
- none..hmm...is it the display???
- and #D1D0D0...border color??

  #15  
Old Apr 24, 2013, 10:47 AM
juggledad's Avatar
juggledad
 
23,571 posts · Mar 2009
OSX 10.11.5 WP 4.x Atahualpa(all) Safari, Firefox, Chrome
if you are not sure of the syntax look it up! w3schools.com/css is a reference site I use all the time.

Bookmarks

Tags
difference, height, links, menu bar

Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes


Similar Threads
Thread Thread Starter Forum Replies Last Post
menu area as big as the container area in the middle of the site Carme Center area post/pages 1 Oct 11, 2012 07:33 AM
Add a link to Logo Area ajgibson Header configuration & styling 3 Sep 23, 2010 07:46 PM
specifying different header & header heights for the home page vs. all other pages ktbiz Header configuration & styling 6 Aug 23, 2010 01:24 PM
[SOLVED] Dashed Lines in Header area / Page menu bar area jstech Header configuration & styling 5 Apr 29, 2010 08:46 AM


All times are GMT -6. The time now is 06:57 AM.


Powered by vBulletin® Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.