# Help with layout

**URL:** <https://community.hubspot.com/t/help-with-layout/136295>\
**Category:** CMS Development\
**Tags:** enterprise\
**Created:** [July 15, 2025, 10:25pm UTC](https://community.hubspot.com/t/help-with-layout/136295 "2025-07-15T22:25:41Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![TaylorLioy](https://avatars.discourse-cdn.com/v4/letter/t/b9e5f3/32.png) [@TaylorLioy](https://community.hubspot.com/u/TaylorLioy)\
**Post date:** [July 15, 2025, 10:25pm UTC](https://community.hubspot.com/t/help-with-layout/136295/1 "2025-07-15T22:25:41Z")

</div>

Hello -- I’m trying to figure out how to get my slider elements at the top of this [test page](https://www.encoder.com/hometest?hs_preview=jvyhcBtb-191478260078) to stay exactly where they are no matter if someone zooms in on their computer. As of now, if someone zooms, because of the way it was laid out, the elements on each slide get very wonky. Is there a fix for this?

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [July 16, 2025, 7:28am UTC](https://community.hubspot.com/t/help-with-layout/136295/2 "2025-07-16T07:28:12Z")

</div>

Hey @TaylorLioy,  
thanks for the link.

Do you mean Browser zoom or OS zoom (like you can do in Windows with 100%,125%…)?

Most likely it’s gonna be a CSS thing, but unfortunately I can’t reproduce any “wonkiness” while zooming upto 200% on my 1440p monitor in Google Chrome.

Can you share screenshots/video of your experience?

Best,

Anton

---

<div class="post-metadata">

**Author:** ![TaylorLioy](https://avatars.discourse-cdn.com/v4/letter/t/b9e5f3/32.png) [@TaylorLioy](https://community.hubspot.com/u/TaylorLioy)\
**Post date:** [July 16, 2025, 5:03pm UTC](https://community.hubspot.com/t/help-with-layout/136295/3 "2025-07-16T17:03:02Z")

</div>

Hey @Anton thanks for the reply! When I drag my screen edges to make it significantly less wide, or if I zoom in via my keyboard, this is when I see items overlap, get cut off, or disappear completely.

 ![](https://d2qpr2jzcazej7.cloudfront.net/original/3X/f/3/f36bebdfaf3663e58ac25f405f56e8d27ad72e5f.png) ![](https://d2qpr2jzcazej7.cloudfront.net/original/3X/8/e/8e0d12e15a14e145b5723a7f34ccf199314f37fe.png)

---

<div class="post-metadata">

**Author:** ![Berangere](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/berangere/32/220784_2.png) [@Berangere](https://community.hubspot.com/u/Berangere)\
**Post date:** [July 23, 2025, 10:46am UTC](https://community.hubspot.com/t/help-with-layout/136295/4 "2025-07-23T10:46:21Z")

</div>

Hi @TaylorLioy and thanks for sharing the screenshots!  
Thanks @Anton for your help!  
Hi @Anton, @evaldas and @GRajput do you have suggestions to help @TaylorLioy, please?  
Have a lovely day and thanks so much for your help!  
Bérangère

---

<div class="post-metadata">

**Author:** ![Berangere](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/berangere/32/220784_2.png) [@Berangere](https://community.hubspot.com/u/Berangere)\
**Post date:** [August 11, 2025, 4:11pm UTC](https://community.hubspot.com/t/help-with-layout/136295/5 "2025-08-11T16:11:24Z")

</div>

Hi @TaylorLioy, just checking on you, do you still need help?  
If yes, I’d like to consult with our Top Experts: Hi @Anton, @Krystina, @TomM2 and @KhushbooP11 do you have some ideas to help @TaylorLioy, please?  
Have a great day and thanks so much in advance for your valuable contributions!  
Bérangère, Community Manager

---

<div class="post-metadata">

**Author:** ![GRajput](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/grajput/32/102020_2.png) [@GRajput](https://community.hubspot.com/u/GRajput)\
**Post date:** [September 21, 2026, 10:50am UTC](https://community.hubspot.com/t/help-with-layout/136295/6 "2026-09-21T10:50:35Z")

</div>

Hi @TaylorLioy

I took a look at the issue, and it looks like the behavior is related to the responsive breakpoints rather than the slider itself.

When you zoom in on a desktop browser, the browser effectively reduces the available viewport width. Once it reaches the tablet/mobile breakpoint, the responsive CSS is applied. This is why the slider elements can start overlapping, getting cut off, or shifting from their original positions.

I also noticed that the header has the following CSS:

```css
@media (max-width: 834px) {
    .hide-tablet {
        display: none !important;
    }
}

```

This rule hides elements completely when the viewport is 834px or below. So when you zoom in far enough for the browser to trigger the tablet breakpoint, those elements are hidden, which can also cause the remaining content/layout to look incorrect or disappear.

I would recommend checking the tablet and mobile styles for the header and slider and making sure the elements have appropriate responsive positioning at those breakpoints rather than relying on the desktop layout.

I hope this helps you out. Please mark it as **Solution Accepted and Like** to help another Community member.  
This post was created with the assistance of AI tools

Thanks!
