strange Gap between content and Header - Support | Kriesi.at

Viewing 10 posts - 1 through 10 (of 10 total)

Author

Posts
March 16, 2025 at 3:57 pm #1479479

ausgesonnen
Participant

there is a unnecessary gap between header and content. It goes away on you start scrolling the page. But really there is no need to be there. I want the page to load without the gap. See video for full explanation.

Please send CSS how to do this or instructions.

March 17, 2025 at 9:13 am #1479502

Rikard
Keymaster

Hey ausgesonnen,

The link to the screenshot is not working. Please check the URL and include a link to where we can see the actual problem as well.

Best regards,
Rikard

March 17, 2025 at 9:29 pm #1479568

ausgesonnen
Participant

strange. How about now? https://imgur.com/a/eDVG2Tz

March 18, 2025 at 1:47 am #1479586

Ismael
Moderator

Hi,

The screenshot is still not available. Please make sure the image has finished uploading before retrieving the share links from Imgur. You can also try Savvyify or Dropbox.

Best regards,
Ismael

March 18, 2025 at 4:15 pm #1479639

ausgesonnen
Participant

https://www.dropbox.com/scl/fi/51zq3kc9icnl9i7pgmh7g/Screen-Recording-2025-03-16-at-15.52.34.mov?rlkey=c4hq54txy2s1thd0vs2fwh5by&st=24gvacui&dl=0

March 19, 2025 at 2:23 am #1479676
Ismael
Moderator
Hi,

Thank you for the short clip.

The extra space is caused by this css rule:
```
.html_header_top #top #main {
    padding-top: 300px !important;
}
```
Adjusting the top padding to 230px should remove the unwanted space.

Best regards,
Ismael
March 19, 2025 at 10:01 am #1479705

ausgesonnen
Participant

Ok, the most I can reduce is down to 100px before the layout breaks. But that is still too much. What else can I do? Please see gap between header and content. It should be much less.

Start

March 19, 2025 at 10:50 am #1479712

ausgesonnen
Participant

In he mobile view the gap is huge. Please send code to reduce both.

March 19, 2025 at 11:00 am #1479714

ausgesonnen
Participant

Ok I have set it back to sticky. becuase the gap is too huge other wise. So back to the plan to shrink the header.

March 20, 2025 at 9:33 am #1479773
Rikard
Keymaster
Hi,

You can have different values depending on screen size, if you add your CSS in media queries. This will target mobile screen sizes for example:
```
@media only screen and (max-width: 767px) {
  Add your mobile styles here
}
```
Best regards,
Rikard
- This reply was modified 4 weeks ago by Rikard.
Author

Posts

Viewing 10 posts - 1 through 10 (of 10 total)

You must be logged in to reply to this topic.