Different header height in responsive view


Author Message
RENE AOKI

Posted: 2/10/2014
Quote message 

IS it posibble to have or manipulate the height of the header in responsive views?

Whan I change to custom responsibe, the header size increases...
I want to change this!

can this be done?
 
Elvira
Artisteer Team

Posted: 2/11/2014
Quote message 

You can change the height after exporting by going to template.css file, finding the code like this:
.responsive .art-header {
min-height: 100px !important;
}

And changing 100px to any other value.
 
Wade

Posted: 1/8/2015
Quote message 

Can this feature be built into Artisteer? I know there are now options for different responsive layouts. But adding the header height as one of those additional parameters to control for various layouts would be very helpful. I hate having to go in and alter code after the fact each time.

 
Eileen
Artisteer Team

Posted: 1/9/2015
Quote message 

Hello Wade,
unfortunately this feature is not included in Artisteer. However you may refer to the good article related to responsive headers
http://www.artisteer.com/?p=responsive_header
 
Greg

Posted: 2/5/2015
Quote message 

Here's a fix that can be added to the CSS rules in the export dialogue box prior to exporting and works a charm in getting the header to resize depending on the size of the header image in responsive view.

Go to the article posted by Eileen, above, and scroll down the the CSS options bit.
Copy each of these options and change the background code with a height fix for each view eg change this:

@media (max-width: 479px)
{
.art-header { background: transparent !important; }
}

to this:

@media (max-width: 479px)
{
.art-header { height: 120px !important;}
}

The height reflects the height of the background image used for that responsive view.
Just do this for each view option.

No more gaps between header and content! :-)