Announcement

Collapse
No announcement yet.

Center site logo

Collapse
X
  • Filter
  • Time
  • Show
Clear All
new posts

  • Center site logo

    I know there's already a topic for this but the instructions didn't work for me, so I guess they are either outdated or it has to do with this additional CSS code I have so that the search bar is in the navigation bar. What I want to do is have our logo in the center of the header while the search bar is still inside the navbar.

    media only screen and (max-height: 480px) {
    #header .site-logo img {
    max-height:none;
    }
    }

    media only screen and (max-height: 360px) {
    #header .site-logo img {
    max-height:none;
    }
    }

    media only screen and (max-width: 360px) {
    #header .site-logo img {
    max-width:344px;
    }

    #header .site-logo.header-edit-box {
    text-align: center;
    }
    }

    media only screen and (max-height: 320px) {
    #header .site-logo img {
    max-height:none;
    }
    }

    media only screen and (max-width: 320px) {
    #header .site-logo.header-edit-box {
    text-align: center;
    }

    #header .site-logo img {
    max-width: 304px;
    }
    }

    #header {
    position: relative;
    height: auto;
    }

    #header .header-cell {
    width: 100%;
    }

    #header .site-logo,#header .site-logo img {
    max-width: 100%;
    }

    #header .site-logo {
    padding: 0;
    }

    #header .site-logo img {
    display: block;
    }

    #header .toolbar {
    position: absolute;
    right: 0;
    bottom: -30px;
    padding: 0;
    width: auto;
    }

    media only screen and (max-width: 440px) {
    #header .site-logo.header-edit-box {
    padding: 0;
    }
    }

    Is the additional code I'm using in CSS Editor. I tried adding position: center; to the parts that say site-logo but it didn't do anything.

  • #2
    If you have a standard header try this:
    HTML Code:
    #header .site-logo {
          padding: 22px 100px 26px 600px;
    }
    Now the beginning of your logo is right in the middle. If your logos width is 100 you could change the 600 to 550 ....

    vBulletin-forum.de | Das deutschsprachige vBulletin 5 Forum! | Widgets, Mods und Anleitungen auf deutsch.
    Team online, Navbar UnreadCount, Navbar-Icons, Moderation-Info, New: Show hook-positions, Auto-close Threads, Latest Likes

    Comment


    • #3
      Does it look central now?
      http://soulowls.com
      Last edited by Gota; Mon 15th Jan '18, 7:22am.

      Comment


      • #4
        Click image for larger version

Name:	Bildschirmfoto 2018-01-15 um 18.42.36.png
Views:	1
Size:	68.6 KB
ID:	4384815

        It looks centered for me.
        vBulletin-forum.de | Das deutschsprachige vBulletin 5 Forum! | Widgets, Mods und Anleitungen auf deutsch.
        Team online, Navbar UnreadCount, Navbar-Icons, Moderation-Info, New: Show hook-positions, Auto-close Threads, Latest Likes

        Comment


        • #5
          Alright, thanks a lot for the help

          Comment

          Working...
          X