logo lined up with navigation

nsitedesigns
nsitedesigns used Ask the Experts™
on
What the heck am I doing wrong?  I would like the logo to line up with the navigation so that the navigation (Services through Home) line up with the middle of the logo.  When I play with just the logo and nav I can get it to work.  See link

http://nsitedesigns.com/nsitedesigns/miller/3.html

When I put the rest of the site in place the nav dips down below logo:
http://nsitedesigns.com/nsitedesigns/miller/test2.html
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Top Expert 2011

Commented:
Try changing this CSS to this:

ul#main-nav {
    float: left;
    margin-top: 36px;
}

Open in new window


Is that what you are looking for?

Commented:
can you post the Css code you are using in your code , ?

Commented:
I suspect you are using percentages on you css instead of pixels
Success in ‘20 With a Profitable Pricing Strategy

Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!

Commented:
Looking it a second time seems that youset you menu relative to the IMG div

Author

Commented:
jonahzona,
Changing the margin on the logo will not effect the navigation.  No matter what I change it to, the navigation remains in the same position.  
Top Expert 2011

Commented:
Alright, do you want to move the navigation up or down?

the code I pasted will move the nav#ul down an additional 6px.

Is this what you are looking to do? To move the navigation down while keeping the logo in the same place?

Author

Commented:
Here is a screen shot showing (in red) where navigation is and (in blue) where I want navigation to be.
http://screencast.com/t/6Uz3YIKhnRs

Navigation needs to be fixed
http://nsitedesigns.com/nsitedesigns/miller/test2.html
http://nsitedesigns.com/nsitedesigns/miller/miller_new.css

Navigation in correct position
http://nsitedesigns.com/nsitedesigns/miller/3.html
http://nsitedesigns.com/nsitedesigns/miller/3.css
Top Expert 2015

Commented:
The menu is too wide to fit there. For example if you add width:100px; to the li it goes where you want it abiet with squeezed menu titles.

Author

Commented:
jonahazona,

I put in your modification.  What that did was push the navigation DOWN but I need the navigation to sit to the RIGHT of the logo.  

Commented:
The site looks fine on Chrome...

Commented:
I say you need to create a new div below your dvi topper

Author

Commented:
tommyBoy,

the menu is where i want it to be in http://nsitedesigns.com/nsitedesigns/miller/3.html.  I copied and pasted the navigation css into http://nsitedesigns.com/nsitedesigns/miller/test2.html.

Why would you say the navigation is too wide when it worked in one situation but not in the other.  The navigation coding is the same.

Author

Commented:
TonyReba,

Can you provide the specs for the div you want me to add below topper.  
Top Expert 2011

Commented:
Got it. This is an IE problem.

Looks good in FF. That is why I was missing the point.......

Author

Commented:
Tony Reba,

The below url fails on Mac's Safari and FF, on a PC in Opera, IE and FF.

http://nsitedesigns.com/nsitedesigns/miller/test2.html.

Author

Commented:
by fails, i mean it doesn't sit to the right of the logo.  

Author

Commented:
it does not work in any browser on mac or pc
http://nsitedesigns.com/nsitedesigns/miller/test2.html.
Top Expert 2011

Commented:
Try adding this

ul#main-nav {
    float: left;
    margin-top: 36px;
    padding: 0;
}

Open in new window


worked for me.
Top Expert 2011
Commented:
The padding on the left was messing it up.

 screenshot
Top Expert 2011

Commented:
Also, that margin-top can be changed back to 30. I think that is what you originally had.

ul#main-nav {
    float: left;
    margin-top: 30px;
    padding: 0;
}

Author

Commented:
Thanks!  I knew it was something simple but was missing.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial