Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Centered navigation won’t stay centered when scaling browser?

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • #45011
    mjL
    Member

    Hi I’m hoping someone can please help me with this because I can’t seem to get it to work properly

    I’ve recently built my portfolio website using squarespace as I’m not a developer and needed a quick way to update projects and make blog posts. Everything is nicely customizable via the menus but certain design tweaks have to be done by “injecting” CSS…

    This is where I hit a road bump as I’m totally CSS illiterate sadly. I can usually find my way around what to code and I’ve been trying the CSS code on – answers.squarespace.com but I’ve not been able to achieve the simple task I’m after which is just to center the navigation in the header.

    I’ve tried the following code but to no avail:

    #nav {width: 250px; margin: 0 auto;}

    also tried…

    #nav {left-align: 45%;}

    which I can get to center the navigation by adjusting the % but as soon as I scale the browser window the nav doesn’t remain in it’s centered position – it only seems to be relative to the size of the window when I was tweaking the %.

    My site is : marklindner.tv or mark-lindner.squarespace.com

    Hopefully someone can help me out or point me in the right direction.

    Thanks,
    Mark

    #136523
    wolfcry911
    Participant

    can you change existing css? if so, look for this:

    #navigator header#topBar ul#nav {
    display: block;
    float: left;
    font-family: “futura-pt”;
    font-size: 14px;
    font-style: normal;
    font-weight: 700;
    letter-spacing: 0;
    line-height: 1em;
    margin: 0 0 0 35px;
    max-width: 50%;
    padding: 35px 0 25px;
    transition: padding 0.25s ease-out 0s;
    }

    eliminate the float: left; and change margin to : 0 auto;

    #136528
    mjL
    Member

    You sir are a genius!! (and I’m an idiot).

    The code worked perfectly, but I had to enter it in a different place than I have been on the squarespace site – needed to be at the root level it seems otherwise it didn’t effect it properly.

    Thanks for your help

Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.