Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • March 2, 2017 at 5:05 am #754063
    bobfurgo

    Hi Guys!

    Hope all is well and love the new update! :)

    I have a quick question regarding the header. Currently have it set as fixed at 140px height which looks great on desktop screens but takes up too much room on laptop screens. I’ve been trying to find the right CSS selectors to modify the header height on laptops but can’t seem to find the right one. Could someone please assist me with this? (see private link)

    Thank you in advance!

    March 2, 2017 at 7:26 am #754103
    Vinay

    Hey peanuttario,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    @media only screen and (max-width:960px) {
	#top #header_main > .container {
    	height: 70px!important;
    	line-height: 70px!important;
    	max-height: 70px!important;
	}
	.html_header_top.html_header_sticky #top #wrap_all #main {
    	padding-top: 90px!important;
	}
	.sfm-navicon-button {
    	top: 0px!important;
	}
}

    Best regards,
    Vinay

    March 2, 2017 at 7:30 am #754104
    bobfurgo

    H Vinay!

    Thanks for the quick response! I put it in the quick CSS but it didn’t work.

    March 2, 2017 at 7:36 am #754109
    Vinay

    Hi,

    You are most welcome :) I checked your site and the code kicks in when the browser width is less than 960px as set in the media query… please feel free to increase the width if you like :)

    Best regards,
    Vinay

    March 2, 2017 at 9:56 am #754221
    bobfurgo

    Hi there!

    Thank you! I should have known! You’re the best :)

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