Solved

Center a dropdown menu line in css

Posted on 2011-03-11
4
251 Views
Last Modified: 2012-05-11
No matter what I try I can't get this display menu line to center.  It also wraps even when I use white-space:nowrap.  How can I resolve these problems:

http://insurance.illinois.gov/2011_NewHeader/menu.html
0
Comment
Question by:smitty62
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 16

Expert Comment

by:SSupreme
ID: 35112769
Try this css instead:
#topNavBar {
    background: none repeat scroll 0 0 #0000FF;
    font-weight: bold;
    margin: 0 auto;
    width: 775px;
}
0
 

Expert Comment

by:phd1974
ID: 35112784
You can try one of two things:

1.) use the align attribute in your div tag

2.) Place your menu within a table that spans 100% of the page, then center align the menu in a TD tag.
0
 

Author Comment

by:smitty62
ID: 35112805
I tried text-align, and that didn't work.  I prefer to keep exclusively CSS with no tables.  Is there another align attribute I should try, and if so where in the style sheet should I put it?
0
 
LVL 16

Accepted Solution

by:
SSupreme earned 500 total points
ID: 35114396
Try this css, which will align links to centre of blue line:
#nav {
    line-height: 1.5em;
    list-style-position: outside;
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    position: relative;
    width: 780px;
}
0

Featured Post

On Demand Webinar - Networking for the Cloud Era

This webinar discusses:
-Common barriers companies experience when moving to the cloud
-How SD-WAN changes the way we look at networks
-Best practices customers should employ moving forward with cloud migration
-What happens behind the scenes of SteelConnect’s one-click button

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
css selector 1 24
Override MS CSS in SharePoint Online Modal Form 19 83
really easy css change help please 4 35
Popup write two lines 3 22
SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this tutorial viewers will learn how to define a gradient in CSS. Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Gradient. Define the background as "linear-gradient(to right, #ee3668, black)". Ensure you …
In this tutorial viewers will learn how to customize the background color and font color of highlighted text using the ::selection element in CSS Begin by defining the selected text as an element in CSS by typing "::selection": Style the ::selection…

730 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question