Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #14505

    Hello!

    You have always been so helpful on this forum, I was wondering if someone would be able to help with the below modifications on my site here:- http://dylan.e-learndesign.co.uk/~teflwp/

    1) I would like to center justify the main navigational bar

    2) I would like to add two buttons (large shortcode buttons) onto the right hand side of the logo, so it sits right justified and above the menu

    Would anyone be able to help me with the custom css required?

    Best regards

    #83720

    Hi _weezer,

    1.) Try to add this on your Quick CSS:

    .main_menu ul:first-child > li > a {
    margin: 0 15px !important;
    }

    .main_menu ul {
    margin-left: 32px !important;
    }

    2) I can already see two buttons above. Just add this code in Quick CSS to position them:

    .teflbuttons .avia-button.light.custom.medium {
    position: absolute;
    bottom: 32px;
    right: 184px;
    }

    .teflbuttons .avia-button.light.custom.xl {
    position: absolute;
    bottom: 32px;
    right: 46px;
    line-height: 2em !important;
    width: 100px !important;
    }

    Just adjust the bottom and right values. Also, you can remove the line-height, I used it to make the buttons consistent in size. Hope this helps. :)

    Regards,

    Ismael

    #83721

    Could you guys tell me what code (and where it belongs) is being used to add those two buttons? I’m guessing it’s in the header.php file but am not sure and would LOVE to add this to a site I’m working on.

    Thanks if you can help!

    #83722

    Hi jwcrash,

    You can do something similar to the above by adding your own div class to hold the buttons and then making the class of the links the .avia-button.light.custom.medium or xl etc.

    <div class="custombuttons">
    <div><a href="http://yourlink.com" class="avia-button light custom xl" >Button Text</a></div>
    </div>

    Then use the same kind of css styling as above to style it.

    You’ll add the html into your header.php where you want them to appear and if you want exactly the same as above you’ll style the custombuttons class to align: right as well.

    Regards,

    Devin

    #83723

    Thanks very much!

    #83724

    Hey,

    Glad we could help. :)

    Regards,

    Ismael

Viewing 6 posts - 1 through 6 (of 6 total)

The topic ‘Custom css help with header’ is closed to new replies.