Monday , February 3 2025

Display: inline-block does not stretch to width, but sticks to the left In Safari

The problem is described in the title of this article.

If elements that in normal browsers stretch across the width of the stage with active display: inline-block; in Safari ignore the width and stick together on the left, then for the parent to which this inline-block was assigned, try to add this one:

display: flex;
justify-content: space-between;

Safari has a caching issue. The easiest option is to open the CSS file in which you have made last edits in a new tab and refresh the page several times. When you see these lines added, check for the sticky content issue on the site side – the problem should be fixed.

About iryna

I'm Iryna, a web developer from Ukraine with a decade of experience solving complex technical challenges in the world of freelance. Throughout my career, I've worked on everything from troubleshooting server-side issues and optimizing website performance to enhancing user interfaces. On this blog, I share detailed solutions to the technical problems I’ve encountered and methods that have worked best for me. In addition to my technical expertise, I’m also passionate about digital drawing. I hope the tutorials and insights I provide here will help both fellow developers and creatives alike in their own projects.

Check Also

How to open html pages without .html

If your site uses links like http://domain.com/testpage.html and http://domain.com/demo.html, and you want them to open …

Leave a Reply

Your email address will not be published. Required fields are marked *