Announcement

Collapse
No announcement yet.

Simple CSS question

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

  • Simple CSS question

    I put up a simple site at http://www.whitebeardthepirate.com and put a Facebook icon link in the nav menu. But I want to put it all the way at the right side of the edge of the menu, rather than where it sits.

    I'm sure it's just a simple tweak to the CSS, but I'm a CSS novice unfortunately.

    Here is the code for that bit:

    .social-icons
    {
    width: 45px;float: right !important;
    padding: 10 !important;
    height: 32px;
    width: 32px;
    }

    .class-facebook, .class-facebook:hover
    {
    background: url(images/facebook-icon32.png) no-repeat right !important;
    }

  • #2
    I think you´d just have to be a bit more specific to overwrite the styling of the primary menu items. You wouldn´t need any !important then. Like, to start with:
    Code:
    .menu-primary li.class-facebook, .menu-primary li.class-facebook:hover {
        background: url(images/facebook-icon32.png) no-repeat right;
        float: right;
        .... add more styles here ....
    }

    Comment


    • #3
      Hmmm, no that made the FB icon disappear and get replaced with the text link "Facebook".

      Comment


      • #4
        You guys are making this too difficult.

        Why not simply add the class = right to the menu item

        Dashboard > Appearances > Menus
        Be sure to enable CSS classes in Screen options and simply add right to the CSS Classes

        Comment

        Working...
        X