Recent
Categories
View Replies (5)

Header problem for Harmony template

  1. Issue
0
Votes
Undo
  1. mattia.cappellari@fomet.it
    mattia.cappellari@fomet.it
  3. Commercial Templates
  4. Tuesday, 22 May 2018
  5.  Subscribe via email
Good evening.
I bought your Harmony template for my site http://www.fomet.it.
My problem is in the header: if I reduce the width of the browser, so to simulate a mobile device, I see there is a lot of blank space just below the header, as you can see in the image attached.
How can I remove all that blank space?
Thank you.
Mattia
Attachments (1)
Screenshot-2018-5-22 Home.png Screenshot-2018-5-22 Home.png
References
  1. http://www.fomet.it
Responses (5)
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Mattia

To amend you can add the following to the Custom CSS field of your templates parameters (Extensions -> Templates -> [YourTemplateStyle] -> Custom CSS)....

@media only screen and (max-width: 1024px) {

#container_header {

    height: auto !important;

    min-height: auto !important;

    padding-top: 35%;

}}


Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 1
mattia.cappellari@fomet.it
mattia.cappellari@fomet.it
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ciarán,
your solution is very good, thank you!
The problem now is it works only for width under 1024px, I think.
Is it possibile to make it work for every width? I tried to remove the line "@media...", but doing so the menu bar goes below the header and I don't want this behavior.
Thank you very much
Mattia
  1. more than a month ago
  2. Commercial Templates
  3. # 2
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
So you tried the following?...

#container_header {

    height: auto !important;

    min-height: auto !important;

    padding-top: 35%;

}


Would you have a screenshot of the issue it creates?

Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 3
mattia.cappellari@fomet.it
mattia.cappellari@fomet.it
Accepted Answer Pending Moderation
0
Votes
Undo
Good morning Ciarán.
In the attached screenshots you can see the position of the menu: "Before.png" shows the desired position (it is the current position), "After.png" shows the position after removing the line from css.
Massimo
Attachments (2)
Before.png Before.png
After.png After.png
  1. more than a month ago
  2. Commercial Templates
  3. # 4
ciaran
ciaran
Love Fool Sherlock Holmes The Voice
Notable Answerer Notable Answerer
Accepted Answer Pending Moderation
0
Votes
Undo
Hello

Does changing the suggested custom CSS to the following resolve the issue?...

#container_header {

    height: auto !important;

    min-height: auto !important;

    padding-bottom: 35%;

}


Ciarán
  1. more than a month ago
  2. Commercial Templates
  3. # 5
mattia.cappellari@fomet.it
mattia.cappellari@fomet.it
Accepted Answer Pending Moderation
0
Votes
Undo
This works very well!
Thank you
Massimo
  1. more than a month ago
  2. Commercial Templates
  3. # 6
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!