Note that there are some explanatory texts on larger screens.

plurals
  1. POSafari - styles applied only on refresh (or some parts on hover)
    text
    copied!<p>I don't even know where to start. On one page of my project, when you enter the page for the first time, some parts of the site disappear and some don't get styled (e.g. border-radius doesn't work). </p> <p>First off, some parts of the header shows up again when you hover over links, or select some text (that is actually invisible before selecting). Everything looks as it should when you refresh the page.</p> <p>Before I found out that hovering or selecting fixes some parts, I thought that styles don't get applied or something like that. I've even tried to remove all the @imports and check if that works. </p> <p>This happens only in Safari, styles get applied to proper elements but those are not rendered properly and are not visible.</p> <p>I don't even know which parts of my code should I post here since it's just basic CSS and it works perfectly everywhere except Safari. Any ideas?</p> <p>@edit: Here's an example of an issue (link <code>your profile</code> is shown, cause I hovered over it) <img src="https://i.stack.imgur.com/JJ05Y.png" alt="enter image description here"> And when you select some parts of the invisible text and than deselect, it shows up: <img src="https://i.stack.imgur.com/C65t7.png" alt="enter image description here"> This is Bootstrap based site, and here's the code for this alert:</p> <pre><code>&lt;div class="alert"&gt; &lt;button type="button" class="close" data-dismiss="alert"&gt;×&lt;/button&gt; &lt;strong&gt;You are not connected to Stripe yet.&lt;/strong&gt; &lt;p&gt;Other people will not be able to find or participate in your experiences until you connect to Stripe. Go to &lt;a href="/profiles/1#stripe-connection"&gt;your profile&lt;/a&gt; to connect to Stripe now.&lt;/p&gt; &lt;/div&gt; </code></pre> <p>Regarding the styles, it's basically just some padding and, obviously orange gradient. On the screenshot, you can see the border radius but sometimes it's not there.</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload