html - issues centering text in nav bar -


I'm having problems with focusing the text in my navigation bar, I try whatever I can think of Any assistance of Lee will be welcomed.

I have my navigation bar here on HTML and CSS code. I have tried to focus on it and use other methods, but still stuck.

hTML

  & lt; Div class = "content-outer" id = "top_nav" & gt; & Lt; Div class = "content-inner" & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Home & lt; / A & gt; & Lt; Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Digital & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Film & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Timeline & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Contact & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Div & gt; & Lt; / Div & gt;  

CSS

 . Container {width: 1060px; Background: #FFF; Padding: 50px; Margin: 0 auto; } #top_nav {status: fixed; Background: # 343642; Font-family: effects, charcoal, non-serif; } #top_nav ul {margin: 0; Padding: 0 pixel 0; List-style: none; Width: 990px; Text align: center; Hidden flurry; } #top_nav ul li {margin: 0x 56px 0 0; Padding: 0; Font-size: 1.7em; Change text: uppercase; Swim left; font-weight: bold; } #top_nav ul li a {color: # fef6e9; Text-decoration: none; Display area; } #top_nav ul li a: Hover {Color: # ed7163; Text-decoration: none; } .content {padding: 10px 0;} .content-outer {width: 100%; Swim left; Overflow: visible; } .content-outer .content-inner {width: 978px; Margin: 0 auto; Overflow: visible; Status: Relative; }  

I removed extra devices; Created a nav element; Margins: 0 Auto; Place on ul ; Float: li on display: inline-block; left; and he has it!

HTML


  & lt; Nav id = "top_nav" & gt; & Lt; Ul & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Home & lt; / A & gt; & Lt; Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Digital & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Film & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Timeline & lt; / A & gt; & Lt; / Li & gt; & Lt; Li & gt; & Lt; A href = "#" & gt; Contact & lt; / A & gt; & Lt; / Li & gt; & Lt; / Ul & gt; & Lt; / Neo & gt;  


CSS


  #top_nav {status: fixed; Background: # 343642; Font-family: effects, charcoal, non-serif; Width: 100%; } #top_nav ul {margin: 0 auto; Padding: 0 pixel 0; List-style: none; Width: 990px; Text align: center; } #top_nav ul li {margin: 0x 56px 0 0; Padding: 0; Font-size: 1.7em; Change text: uppercase; Display: Inline-block; font-weight: bold; } #top_nav ul li a {color: # fef6e9; Text-decoration: none; Display area; } #top_nav ul li a: Hover {Color: # ed7163; Text-decoration: none; }  

Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -