# Website Not Appearing in Safari on iPad as it Appears in Elements

**URL:** <https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638>\
**Category:** Elements\
**Created:** [October 9, 2025, 10:16pm UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638 "2025-10-09T22:16:22Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![chet](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/chet/32/35396_2.png) [@chet](https://forums.realmacsoftware.com/u/chet)\
**Post date:** [October 9, 2025, 10:16pm UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/1 "2025-10-09T22:16:22Z")

</div>

Hello All,

I’m enjoying how much I can refine a website’s appearance with Elements. I’ve got a content block that appears perfect in my Elements Project, but totally different on my iPad (Safari) in portrait.

Project: [Elements Cloud](elementsapp://downloadDocument/GZZ7FqsHGnIR)

Live Link: [Trusted Aircraft Brokerage & Sales | HX Aviation, LLC](https://dev.chetcomm.com/hx)

On the Main page, the first content block “About HX Aviation, LLC” appears perfect in the Elements browser for the MD screen size (1080px), but in Safari on my iPad Pro 12” in portrait the content is squeezed off to the left side.

Can you spot where I went wrong?

---

<div class="post-metadata">

**Author:** ![MichaelDroste](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/michaeldroste/32/37212_2.png) [@MichaelDroste](https://forums.realmacsoftware.com/u/MichaelDroste)\
**Post date:** [October 9, 2025, 11:25pm UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/2 "2025-10-09T23:25:20Z")

</div>

Haven’t looked but I had a similar problem on a page…

The container wasn’t working…

With the offending section - make sure it’s in a container and / or delete and put in a new container

Hope that helps!

- mike

---

<div class="post-metadata">

**Author:** ![chet](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/chet/32/35396_2.png) [@chet](https://forums.realmacsoftware.com/u/chet)\
**Post date:** [October 10, 2025, 12:00am UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/3 "2025-10-10T00:00:52Z")

</div>

Good thought! No luck

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [October 10, 2025, 7:51am UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/5 "2025-10-10T07:51:57Z")

</div>

> [@chet](#):
>
> On the Main page, the first content block “About HX Aviation, LLC” appears perfect in the Elements browser for the MD screen size (1080px), but in Safari on my iPad Pro 12” in portrait the content is squeezed off to the left side.

Annoyingly I only have an 11" iPad and your site looks fine on that.

It probably is a width setting on something… I’ll chat with @ben and see if he can spot anything obvious…

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [October 10, 2025, 7:57am UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/6 "2025-10-10T07:57:28Z")

</div>

Quick Update. I think @upssjw might be onto something…

I asked ChatGPT about the issue, and he responded with a similar suggestion:

> • Remove md:min-w-[1080px] anywhere it appears on that block.  
> • Use w-full max-w-[1080px] mx-auto or max-w-screen-\* breakpoints instead.  
> • Keep some horizontal padding (px-4 / md:px-6) so content doesn’t kiss the edges.  
> • If a parent has overflow-hidden plus a too-wide child, you’ll see the same “squeezed” effect — fix the width, not with overflow hacks.

A good thing to try is removing parts of the layout and see if it fixes the issue, you can then re-build those parts back in and check as you go (I hope that makes sense).

Let us know how you get on!

---

<div class="post-metadata">

**Author:** ![upssjw](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/upssjw/32/26063_2.png) [@upssjw](https://forums.realmacsoftware.com/u/upssjw)\
**Post date:** [October 10, 2025, 8:26am UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/7 "2025-10-10T08:26:25Z")

</div>

Looks like the width setting is not standard, not sure how it was added, not looked at the project, would have thought this has been added somehow, might be wrong

---

<div class="post-metadata">

**Author:** ![chet](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/chet/32/35396_2.png) [@chet](https://forums.realmacsoftware.com/u/chet)\
**Post date:** [October 10, 2025, 11:07am UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/8 "2025-10-10T11:07:07Z")

</div>

Thanks, all! I will try rebuilding the content block and see if I can figure out what is causing this behavior.

I guess my larger question is I want to understand why the layout would appear different in Elements vs a browser of the same size. These screenshots show what I’m seeing.

 ![Screenshot 2025-10-10 at 7.04.01 AM](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/8/d/8d1f117b7f350100d71df966642ba55f56689ea7.jpeg)

_Project view in Elements for Portrait iPad size screen_

 ![Trusted Aircraft Brokerage & Sales HX Aviation, LLC](https://europe1.discourse-cdn.com/flex005/uploads/realmacsoftware1/original/3X/3/a/3a5c19113b03b55a03e4b1629a6afa40265a2ddd.jpeg)

_Live site viewed on iPad Pro 11” in Safari_

---

<div class="post-metadata">

**Author:** ![chet](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/chet/32/35396_2.png) [@chet](https://forums.realmacsoftware.com/u/chet)\
**Post date:** [October 10, 2025, 12:06pm UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/10 "2025-10-10T12:06:25Z")

</div>

> [@upssjw](#):
>
> max-w-text\_max-width

It appears that to control the layout, the Flex elements were given a max width of “Text Max-Width” I disabled them in all of the Components and it did not fix the issue.

I started this project with the Holos theme by 1LD; this content block is from that project file. The behavior appears in the original project file, too. The layout is perfect in Elements, but appears totally differently in the browser.

---

<div class="post-metadata">

**Author:** ![dan](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/dan/32/28516_2.png) [@dan](https://forums.realmacsoftware.com/u/dan)\
**Post date:** [October 10, 2025, 12:11pm UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/11 "2025-10-10T12:11:24Z")

</div>

Ah, you can see this in the editor if you resize the window, maybe you just need to reduce the gap?

Does that fix it for you?

**Edit:** I also see you’ve changed the default breakpoints (which are standard in Tailwind). I probably wouldn’t do that unless you have a **very** strong need and understanding of different sized devices and how changing the breakpoints will affect that.

---

<div class="post-metadata">

**Author:** ![chet](https://dub1.discourse-cdn.com/flex005/user_avatar/forums.realmacsoftware.com/chet/32/35396_2.png) [@chet](https://forums.realmacsoftware.com/u/chet)\
**Post date:** [October 10, 2025, 12:20pm UTC](https://forums.realmacsoftware.com/t/website-not-appearing-in-safari-on-ipad-as-it-appears-in-elements/51638/13 "2025-10-10T12:20:13Z")

</div>

Thanks Steve & @dan!

I see that the Holos theme has changed the standard breakpoints. I’ve got them reset in the Theme Studio from the Empty Project standard and will strip out with that extra width to get everything to display properly.
