Home>Support>CSS & Menu Questions

CSS & Menu Questions

This link shows a screen capture of what I want to do via CSS tweaks, see image:
http://cell-web.com/wp-content/uploads/site_origin1.jpg

– In the top menu, I want to make all fonts larger (ex: 16px)
– Make menu background transparent (or remove it) so that the page background shows through
– Increase height of menu bar to bottom of background gray bar (as illustrated)
– I want to remove borders around images

Also if possible, when the menu bar increases in height, will the logo increase proportionally or is there a CSS addition I must make for that?

Thank you,

Tom

PS: This is the 3 or 4th. Vantage Theme I have registered for customers. Love what you offer. Thanks.

URL: http://cell-web.com/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 10 years, 5 days ago Andrew Misplon
    Hi, I Work Here

    Hi Webunet

    Thanks for your continued support.

    Menu Font Size – insert at Appearance > Custom CSS:

    /* Vantage Set Menu Font Size */
    
    .main-navigation {
    font-size: 16px;
    }
    

    Menu Opacity – if you have the sticky menu turned on it’s a little tricky, try this:

    .main-navigation { background: rgba(34, 34, 34, 0.8) !important; }
    nav:nth-of-type(1) { display: none; }
    .site-navigation.sticky { width: 100% !important; }
    

    Menu bar height:

    The logo in this layout gets constrained, if you want to remove that constraint you can insert the following at Appearance > Custom CSS:

    /* Vantage Remove Logo in Menu img constraint */
    
    header#masthead.masthead-logo-in-menu .logo > img {
    max-height: none !important;
    }
    

    Not quite sure what you’re looking to do with the menu height there but you could add menu padding as follows; change my numbers for yours:

    .main-navigation {
    padding: 20px 0 20px;
    }
    

    Image Shadow and Rounding:
    Appearance > Customize > Page: Image Shadow and Rounding checkbox

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More