Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
JustinBlack

Pacific - Nav Bar centering issue with CSS

Question

Site URL: http://www.terminallyinlove.com

Hello,

On my website www.terminallyinlove.com , I am using the CSS below to remove the title from the top bar navigation. The resulting issue is that the top bar nav is off-centered. I've attached a screenshot to illustrate. 

Is there any additional CSS I can use to fix the offset? I have very little programming knowledge unfortunately. 

The CSS I'm currently using is:

#siteTitle { display: none }

div.index.home {
margin-right: 0 !important;
margin-left: 0 !important;
}

Thanks for your help!

TIL Page example.jpg

Share this post


Link to post

11 answers to this question

Recommended Posts

  • 0

Thanks for the reply @derricksrandomviews. I'm afraid my lack of programming knowledge is showing - I tried copying various bits of code after my existing CSS, with no effect. Could you please advise on how to properly integrate the info contained in that thread with my existing CSS?

Share this post


Link to post
  • 0
Posted (edited)

Put this is custom CSS may need to play a bit and change word left to center. Before you do that Open CSS in window, easier to see, scroll to bottom and paste the code. Leave the word left at first try, because the nav bar may already "think" it is centered. If it doesn't move or moves to far left change left to center. 

nav li {
   float: left;
}
nav {
   display: inline-block;
}
Edited by derricksrandomviews

Share this post


Link to post
  • 0

@derricksrandomviews same thing, no effect. Thanks for your patience.

To make sure I'm doing this correctly, this is what was in my CSS window (I just copied it after the existing CSS):

#siteTitle { display: none }

div.index.home {
margin-right: 0 !important;
margin-left: 0 !important;
}
#topNav .main-nav {

text-align: center;
 }

Share this post


Link to post
  • 0
Posted (edited)

I say we don't give up yet:

#header #mainNavWrapper .index { 
   margin: 0 0 0 12px !important; 
   text-align: center !important;
}

Play with font size but first lets get the nav bar in the right spot, I got this from a pacific user so lets see how it goes. Remove everything else I suggested first of course. 

Edited by derricksrandomviews

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...