Last active
December 23, 2015 14:39
-
-
Save agusmu/6649920 to your computer and use it in GitHub Desktop.
PrimaShop - Adjust Header Height With Responsive Logo
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* minimum height of your header */ | |
| /* 120 = 35 (top) + 50 (logo height) + 35 (bottom) */ | |
| #header { | |
| min-height: 120px; | |
| } | |
| /* adjust top and bottom padding of the responsive logo */ | |
| #header-title a.header-logo { | |
| padding-top: 35px; | |
| padding-bottom: 35px; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* specify max height for responsive logo */ | |
| #header-title a.header-logo img { | |
| max-height: 50px; | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* fixed header height */ | |
| #header { | |
| height: 120px; | |
| } | |
| /* reset fixed header height smaller devices */ | |
| @media only screen and (max-width: 1000px) { | |
| #header { | |
| height: auto; | |
| } | |
| } |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| #header-title .site-title a, #header-title .site-title a:visited { | |
| padding-top: 35px; | |
| padding-bottom: 35px; | |
| } |
Great stuff, thanks so much, I only have 1 question I hope you can help me with.
So I would like to add a footer with some html I have, but if I add it in the first product description area, the footer gets squished into the dimensions specified in this code you created. Thus, I am wondering if it is possible to separate the product description some how and make it 100% with everything else constrained to the rules specified in the code just like normal.
This is regarding style_01 FYI
Nevermind, I figured it out. Thanks again.
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Tutorial: http://www.primathemes.com/documentation/primashop-adjust-header-height-responsive-logo/