[Resolved] Adjusting menu items at specific size

Home Forums Support [Resolved] Adjusting menu items at specific size

Home Forums Support Adjusting menu items at specific size

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #328593
    Chris

    Okay. The CSS has been validated first. = )

    I’m trying to adjust the letterspacing and the padding for this menu before it hits the mobile size.

    View post on imgur.com

    .main-navigation .main-nav ul li a {
    	font-family: texta-black-webfont, Helvetica, Arial, San-Serif !important;
    	letter-spacing: 1.5px !important;
    	text-transform: uppercase !important;
    }
    @media (max-width: 769px) {
    	.main-navigation .main-nav ul li a {
       		font-family: texta-black-webfont, Helvetica, Arial, San-Serif !important;
        	letter-spacing: .8px !important;
    	    text-transform: uppercase !important;
        	padding-left: 7px !important;
    	    padding-right: 7px !important;
        	line-height: 15px !important;
        	font-size: 15px !important; 
    		}
    }

    http://gtg2017.giantishere.com/contact-forms/newsletter-signup/

    #328599
    Leo
    Staff
    Customer Support

    Hi there,

    I can see the CSS being added? https://postimg.org/image/dl0mewpwr/98427c54/

    Or that’s not your question?

    #328605
    Chris

    It’s added but it’s not affecting the menu in the way it should. I don’t see it affecting the menu at all just like in the screen shot.

    What do I need to change to get it working?

    #328608
    Leo
    Staff
    Customer Support

    Which part? Those codes are doing what those codes are supposed to do?

    What are you hoping them to do?

    #328905
    Chris

    The code should be affecting the padding, letterspacing and the font size. It’s not activating at the specified size. In fact, it’s not changing at all. I’m just trying to help alleviate this awkward spacing for the size between the tablet and the phone sizes.

    #328913
    Leo
    Staff
    Customer Support

    But you didn’t add style for padding or font size for the desktop portion of the code?

    The code in @media (max-width: 769px) won’t trigger until the screen size is less than 769px.
    If you changed the mobile break point as I recalled before then you would need to change all the px number to match as well.

    For the spacing you should be able to use the menu item width: https://docs.generatepress.com/article/secondary-menu-item-height-width/

    #328974
    Chris

    That got it. It was the silly number. Almost done with this site for a while!

    = \

    CDS

    #328976
    Leo
    Staff
    Customer Support

    Awesome!

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