csstyle icon indicating copy to clipboard operation
csstyle copied to clipboard

iOS

Open alihs opened this issue 8 years ago • 11 comments

The styles generated by cssstyle.io are not rendering on iOS. Can you confirm this please? I need help.

an example would be a sub class {./--} not rendering

alihs avatar Sep 23 '15 16:09 alihs

Do you mean in mobile safari? Also if you could paste a small sample that would help me debug the issue. It's likely that your HTML is just missing the right classes. On Wed, Sep 23, 2015 at 10:09 AM alihs [email protected] wrote:

The styles generated by cssstyle.io are not rendering on iOS. Can you confirm this please? I need help.

— Reply to this email directly or view it on GitHub https://github.com/geddski/csstyle/issues/56.

geddski avatar Sep 23 '15 16:09 geddski

<div class=“banner-box --bg-green”></div>

any styles on --bg-green doesnot come through on iOS safari and Windows Phone native browser

alihs avatar Sep 23 '15 16:09 alihs

can you share your banner-box component (and bg-green option)?

geddski avatar Sep 23 '15 16:09 geddski

<body id="EXAMPLE">

    <div class="banner-box --bg-green">
        This is a banner with a green background.
    </div>

    <div class="banner-box --bg-blue">
        This is a banner with a blue background.
    </div>

</body>
@include component(banner-box){
    padding: 30px;
    color: white;
    background-color: red;
    margin-bottom: 30px;
    text-align: center;

    @include option(bg-green){
        background-color: green;
    }

    @include option(bg-blue){
        background-color: blue;
    }
}

it is a very basic example. none of the option classes that are not rendering on IOS Safari and Micorosft Windows Phone

alihs avatar Sep 23 '15 17:09 alihs

hmm, that should work just fine. Does it work on desktop chrome?

geddski avatar Sep 23 '15 17:09 geddski

It's also possible that your sass hasn't run again since adding those options. Take a look at the compiled CSS file and see if it has them.

geddski avatar Sep 23 '15 17:09 geddski

Works fine on desktop and compiles fine as well. Is it working fine on your iOS?

Ali Hussain

-----Original Message----- From: "Dave Geddes" [email protected] Sent: ‎9/‎23/‎2015 10:42 PM To: "geddski/csstyle" [email protected] Cc: "alihs" [email protected] Subject: Re: [csstyle] iOS (#56)

It's also possible that your sass hasn't run again since adding those options. Take a look at the compiled CSS file and see if it has them. — Reply to this email directly or view it on GitHub.

alihs avatar Sep 23 '15 17:09 alihs

yeah works just fine. csstyle.io is built with it, looks great on mobile. Maybe your CSS is being cached on mobile safari?

geddski avatar Sep 23 '15 18:09 geddski

totally strange. my desktop site works fine but the mobile site is acting weird. Could it be a utf-8 issues?

alihs avatar Sep 28 '15 18:09 alihs

I think I figured out the cause of the issue. I believe csstyle is missing an escape somewhere. In Chrome if your CSS has a .--card class, it will render just fine. On iOS it won't, unless you escape it properly: \.--card. I'll try to track down where this might be happening.

geddski avatar Dec 17 '15 07:12 geddski

Thanks. Also i too forgot to update, it was my css compressing engine that was doing this. I had to add a few rules to it and it worked.

  • Ali Hussain

On Thu, Dec 17, 2015 at 12:35 PM, Dave Geddes [email protected] wrote:

I think I figured out the cause of the issue. I believe csstyle is missing an escape somewhere. In Chrome if your CSS has a .--card class, it will render just fine. On iOS it won't, unless you escape it properly: .--card. I'll try to track down where this might be happening.

— Reply to this email directly or view it on GitHub https://github.com/geddski/csstyle/issues/56#issuecomment-165373190.

alihs avatar Dec 17 '15 13:12 alihs