ramtam92 Comments - Answer Overflow

ramtam92

Posts Comments

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

its because of kaios 2.x

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

I kinda solved the issue. Still not explainable, why browser get irritated by the -moz-placeholder-shown prefix but configuring browserslist with

"browserslist": [
        ">= 0.4%",
        "last 2 versions",
        "not dead",
        "Firefox ESR",
        "not kaios < 3"
    ]`

"browserslist": [
        ">= 0.4%",
        "last 2 versions",
        "not dead",
        "Firefox ESR",
        "not kaios < 3"
    ]`

solves the issue – not optimizing for old firefox versions and ignoring Kai OS smaller than 3 🤷‍♂️

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

strangley, the issue occurs in multiple browsers. so basicaly, its not only a "safari bug on the last version" but something deeper within how prefixes get handled. oh man, this one will get tricky to debug 😵‍💫

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

yeah thats what I'm thinking as well 🤷‍♂️

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

wow, my last message lead me on the correct way, I was able to identify the issue. When I disable autoprefixing in vite/postcss, and my css doesn't render textarea:-moz-placeholder-shown before the regular statement textarea:placeholder-shown {background: red;}, all browsers show the style. But since I would appreciate some prefixing, I'm still stunned why browsers just don't ignore this prefix 🤔

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

No I can't yet, still everything local atm. I've been sitting on this one quite some time and I can't figure it out. So strange, never happend before 😧 I can't explain, why the browser doesn't pickup code, which is clearly getting outputted in the style.css 🤔

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

yes thats true, maybe the title is misleading. When I add the style with a style tag, its working fine. But when I bundle it with vite.js, even though the code is inside the bundled style.css, its not rendering 🤷‍♂️

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 4/29/2024 in #front-end

:placeholder-shown stopped working on all browsers expect Firefox after vite.js bundles css

I can add some more details for clarification: Its a tailwind / vitecss build and I'm styling a textarea when the placeholder is shown like this:

textarea:placeholder-shown {
    background: red;
}

textarea:placeholder-shown {
    background: red;
}

As written, Firefox is styling it correctly, chromium and webkit browsers don't. They don't style anything. 🤷‍♂️ When I build the css, I see the specific style existing: textarea:-moz-placeholder-shown {background: red;} textarea:placeholder-shown {background: red;} but still, chrome, edge and safari don't care about it. I also don't see it listed and overwritten somewhere in the inspector. When I go and add the css into a style tag within the html, it works in all browsers. So basically, I'm seeing working code listed in the style.css but still, the majority of the browser just ignoring it. I'm pretty lost about this one. Am I overseeing something?

18 replies

KPCKevin Powell - Community

•Created by ramtam92 on 10/16/2023 in #front-end

responsive videos, loaded based on view port width

Unfortunately its not, I have checked. Chrome removed the media="" option from the video tag. Even though its mentioned here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/source#video_with_media_attribute_example its not working in all chromium browsers (chrome, arc, ect) 🤷‍♂️

5 replies

KPCKevin Powell - Community

•Created by ramtam92 on 1/31/2023 in #front-end

Which is the best slider/gallery library?

yeah thats where I'm not sure as well. There are so many options available and as long as their vanilla js and not very heavy, I always had a good feeling using them. coding and maintaining a slider myself could be very time consuming and not very good billable to customers.

11 replies

KPCKevin Powell - Community

•Created by ramtam92 on 1/31/2023 in #front-end

Which is the best slider/gallery library?

yeah that would be interested to see and play arount. To be honest, I'm kinda afraid getting into something which will take forever to run on every major browser and mobile device.

11 replies

KPCKevin Powell - Community

•Created by ramtam92 on 1/31/2023 in #front-end

Which is the best slider/gallery library?

Wow cool that sounds motivating. Did you already code a slider yourself for any kind of projects?

11 replies

KPCKevin Powell - Community

•Created by ramtam92 on 12/9/2022 in #front-end

Seeking help regarding tricky image gallery layout

The designers didn't had any technique in mind at all, they are mainly print designers without too much knowledge in webdev. May I ask where you hade seen similar implementation?

9 replies

Gaming

Programming