Change height and width only for specific page (landing page) #5253

New Issue

OVERLORD · 2026-02-05T09:51:45+03:00

OVERLORD commented

2026-02-05 09:51:45 +03:00

Originally created by @crazyyzarc on GitHub (Apr 9, 2025).

Attempted Debugging

I have read the debugging page

Searched GitHub Issues

I have searched GitHub for the issue.

Describe the Scenario

Hello, Can I change the css parameters of width and height for only specific page (my landing page) more tightly? I changed the title to blank because I don't need a title. Everything is regulated by the article content.

Best regards
crazyyzarc

Exact BookStack Version

v24.10.1

Log Content

No response

Hosting Environment

Debian 12.10

Originally created by @crazyyzarc on GitHub (Apr 9, 2025). ### Attempted Debugging - [x] I have read the debugging page ### Searched GitHub Issues - [x] I have searched GitHub for the issue. ### Describe the Scenario Hello, Can I change the css parameters of width and height for **only specific page** (my landing page) more tightly? I changed the title to blank because I don't need a title. Everything is regulated by the article content. ![Image](https://github.com/user-attachments/assets/1678dc1e-4f95-4453-ad28-be528b5a3976) Best regards crazyyzarc ### Exact BookStack Version v24.10.1 ### Log Content _No response_ ### Hosting Environment Debian 12.10

OVERLORD added the 🐕 Support label 2026-02-05 09:51:45 +03:00

OVERLORD closed this issue

2026-02-05 09:51:47 +03:00

OVERLORD commented

2026-02-05 09:51:49 +03:00

@ssddanbrown commented on GitHub (Apr 9, 2025):

Hi @crazyyzarc,

You could get inventive by using CSS to target areas only when the "toggle details" button is at play (which should be just the homepage). The below would go in the "Custom HTML Head Content" customization setting:

<style>
  #content:has([component="expand-toggle"]) .content-wrap {
    padding-inline: 4px;
  }
  #content:has([component="expand-toggle"]) .page-content {
    max-width: 100%;
  }
  #content:has([component="expand-toggle"]) .page-content h1 {
    display: none;
  }
</style>

@ssddanbrown commented on GitHub (Apr 9, 2025): Hi @crazyyzarc, You could get inventive by using CSS to target areas only when the "toggle details" button is at play (which should be just the homepage). The below would go in the "Custom HTML Head Content" customization setting: ```html <style> #content:has([component="expand-toggle"]) .content-wrap { padding-inline: 4px; } #content:has([component="expand-toggle"]) .page-content { max-width: 100%; } #content:has([component="expand-toggle"]) .page-content h1 { display: none; } </style> ```

OVERLORD commented

2026-02-05 09:51:51 +03:00

@crazyyzarc commented on GitHub (Apr 10, 2025):

thanks a lot! It works! ;)

@crazyyzarc commented on GitHub (Apr 10, 2025): thanks a lot! It works! ;)

Sign in to join this conversation.

Branches Tags

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: starred/BookStack#5253