Skip to Content (Press Enter)
2018-12-11 13-32-05
Martijn Habraken
51Views
3Comments
Increasing header height without disturbing other placeholders
Question
CSS
Hi all,

I'm using the Liverpool theme and I tried to increase the height of the header webblock.
So I changed the size of the image in the header to have a min height. This give the result I'm looking for but the other placeholders (Title, Action and Maincontent) keep the same position. So partially the menu is now covering the title.

What’s the correct way of increasing the header without disturbing the other placeholders?

thanks!
Martijn
0
0
12 Aug 2015
Copy Link
2018-12-11 13-32-05
Martijn Habraken
So I found the problem.
in the CSS of the header is the position fixed

.Header {
    position: fixed;
    }

And normally the main content starts 105px from the top

.Content {
    padding-top: 105px;
}
This is standard Liverpool theme.
So if you want to increase the header with for example 20px then you should add the 20px to the padding-top.
Are there CSS Ninjas here that have a better solutions, because mine is not very dynamic?

0
0
13 Aug 2015
Copy Link
2018-05-03 15-48-34
Samuel Jesus
Staff
Hello Martijn,

First of all, sorry for the late reply, but since you posted this issue outside of the LiverpoolTemplate Discussions, we didn't catch the post immediately.

The Liverpool Template actually dependes on that structure to work properly, so there's actually no better or more dynamic way to do what you need.

Best Regards,
Samuel Jesus

0
0
13 Aug 2015
Copy Link
2018-12-11 13-32-05
Martijn Habraken
Hi Samuel,

No problem, in the beginning I thought that this was general OutSystems behaviour.
Thanks for verifying my solution.

Kind regards,
Martijn Habraken
0
0
14 Aug 2015
Copy Link
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.