You should see a canopy on top of this page. This is a great little item. You can add a canopy onto the top of your website which adds some atmosphere to it. This is specific to a joomlashine template but can easily be changed to any site.
CSS
/*-- Header Canopy --*/ /* Set Header Size - also corrects for mobile*/ #jsn-header { padding-top: 140px; } @media only screen and (max-width: 480px), (max-device-width: 480px) { #jsn-header { padding-top: 60px; } } /* Background Image */ #jsn-page { background-image: url(/images/kb/2016/789/canopy.png); } #jsn-page { background-size: 100% auto; background-repeat: no-repeat; } /* This stops the canopy from ever expanding (optional) */ @media only screen and (min-width: 1170px) { #jsn-page { background-size: 1170px; background-position: top; } }
Notes
- From the JSN Gruve Template
- There are different coloured canopy graphics with this template that you can use. I think there is also the source PSD so you can modify it yourself.
- You do not have to use this graphic. You can use anything you want.
- Depending on the type of the tempalte you have the canopy might keep stretching
- The canopy is rigged to stop expanding at 1170px but you can remove the rule for this and then it will keep expanding i.e. 100%