@simevidas@mastodon.social
@simevidas@mastodon.social avatar

simevidas

@simevidas@mastodon.social

I’m interested in HTML, CSS, and making the web less annoying. My name is pronounced ˈshe-meh.

This profile is from a federated server and may be incomplete. Browse more on the original instance.

simevidas, (edited ) to random
@simevidas@mastodon.social avatar

Your tweets can no longer be viewed by people who are not logged in. If you tweet something today, you’re not sharing it publicly.

This basically prevents me from tweeting original content anymore. I cannot have my tweets be behind a login wall. That’s unacceptable.

I cannot even share links to tweets anymore because some of my readers may not be able to easily access that content.

Twitter has made bad moves recently, but this is the worst by far.

simevidas, to random
@simevidas@mastodon.social avatar

height: 100dvh causes constant layout shifts when the user scrolls the page in mobile browsers. Use height: 100svh instead.

Test page: https://output.jsbin.com/qunasan/quiet

P.S. If you found a good use-case for the dvh unit, could you share it? I haven’t found anything. 😔

simevidas, to random
@simevidas@mastodon.social avatar

I need help with CSS debugging:

Why is the image too wide, causing a horizontal scrollbar? This looks like a 100vw issue, but I don’t see that value anywhere.

https://www.jamiesitalian.rs/en/ji-serbia/

video/mp4

simevidas, to random
@simevidas@mastodon.social avatar

Imagine a very long web page with lots of sections (e.g., single-page HTML spec). If the user requests a specific section (e.g. page.html#section7), what if the web server streamed that section first and the other sections after that?

Stream order:

  1. start of HTML document up to <body>
  2. HTML for section 7
  3. HTML for section 1, 2, 3, etc.

The browser would then make sure to insert the sections 1 to 6 above section 7 on the web page.

Does this make sense? Would this be useful?

simevidas, to random
@simevidas@mastodon.social avatar

Isn’t it weird that CSS is a critical part of all websites, and yet “CSS expert” does not seem to be a particularly valued profession?

simevidas, to random
@simevidas@mastodon.social avatar

Are Chrome and Safari able to create full-page screenshots like this? Firefox can.

(The included image is just a low-resolution example on a gray background, so that you know what I’m talking about. The real image is very high resolution.)

simevidas, to random
@simevidas@mastodon.social avatar

Somebody at Google thought they’re being funny. I don’t think this is funny. It’s wrong. The exact opposite should be true. Whatever remains must not be an empty page.

simevidas, to random
@simevidas@mastodon.social avatar

If browsers introduced a mode where JavaScript doesn’t run by default and without any restrictions, a mode where JS is only allowed in certain conditions and with limitations.

What would happen? Websites would start adapting. They would start reducing JS to stay within the allowed limits. HTML and CSS featues would be used more. The less annoying static banner ads would make a return.

The web would start healing. Why is nobody talking about this?

simevidas, (edited ) to random
@simevidas@mastodon.social avatar

User attempts to submit form. Something breaks. Website shows error page. User reloads page or goes Back. Form inputs are empty.

As a browser, how would you fix or mitigate this issue?

edit: minor text fixes

simevidas, to random
@simevidas@mastodon.social avatar

https://www.w3.org

Font size 14px? Ugh, that’s too small for my eyes. Let me zoom the page to 120%. … Whoops, mobile layout.

Does anyone else think that this is a problem?

simevidas, to random
@simevidas@mastodon.social avatar

I felt a chill run down my spine.

simevidas, to random
@simevidas@mastodon.social avatar

Should this be an HTML feature?

(https://en.wikipedia.org/wiki/Gamescom)

The linked Wikipedia page has collapsed tables with show/hide toggle buttons.

simevidas, to random
@simevidas@mastodon.social avatar

“Introducing the KaiOS TZ1“

Some people in Tanzania will use this smart feature phone to browse the web over 2G. Talk about optimizing web performance.

https://www.kaiostech.com/introducing-the-most-affordable-connected-mobile-phone-in-tanzania/

simevidas, (edited ) to random
@simevidas@mastodon.social avatar

I asked on Reddit why people use Chrome.

  1. profiles
  2. Passkeys
  3. web page translation on Android

TBC

edit: I wonder if Mozilla maintains a list like this. They should. ”The main reasons why people don’t want to switch from Chrome to Firefox.”

simevidas, to random
@simevidas@mastodon.social avatar

Image gallery without JavaScript (proof of concept)

The large image is in an iframe. The thumbnails are links that target that iframe.

Firefox only because it’s the only browser that auto-scales images to fit the iframe viewport. (Why don’t other browsers do this?)

Test page: https://output.jsbin.com/bomiyur/quiet

simevidas, (edited ) to random
@simevidas@mastodon.social avatar

I got tired of websites that turn their article title headings into links, which gets in the way of me selecting the heading text, so I created a global user style that disables such links:

h1 a {
pointer-events: none !important;
}

edit: It took me literally less than 60 seconds to do this, and this usability problem is now gone forever in my desktop browser. What a huge win.

simevidas, (edited ) to random
@simevidas@mastodon.social avatar

What are my CSS user preferences?

https://simevidas.github.io/css-prefs/

(I wasn’t sure if this existed, so I made it.)

simevidas, to random
@simevidas@mastodon.social avatar

Could we have “Copy to clipboard” buttons without JavaScript?

<form>
<textarea>Some text</textarea>
<button type=copy>Copy to clipboard</button>
</form>

simevidas, to random
@simevidas@mastodon.social avatar

You have a <table> with two columns. Some <th> and <td> cells span both columns. You want the columns to be equally wide. How do you do it?

simevidas, to random
@simevidas@mastodon.social avatar

Why I use Firefox https://šime.eu/3

simevidas, to random
@simevidas@mastodon.social avatar

This works without JavaScript because it’s <details>, and that works without JavaScript because it’s <a>.

Before adding another JS library, ask yourself if HTML can do it.

video/mp4

simevidas, to random
@simevidas@mastodon.social avatar

The Economist has not yet mastered the arts of preventing the page in the background from scrolling while the modal dialog is open.

And by arts I mean one line of CSS:

overscroll-behavior-y: contain;

video/mp4

simevidas, to random
@simevidas@mastodon.social avatar

This one fooled me twice. Shame on me.

simevidas, to random
@simevidas@mastodon.social avatar

No persistent storage for websites on iOS in EU:

https://twitter.com/dannymoerkerke/status/1760239235762663735

simevidas, to random
@simevidas@mastodon.social avatar

It’s official: the CSS spec is telling browsers to shrink 100vw on pages with overflow: scroll or scrollbar-gutter: stable on the <html> element in browsers with classic scrollbars.

https://github.com/w3c/csswg-drafts/commit/cae9002d1eadbb7b5b68fb8b377c2400ba4e127a

  • All
  • Subscribed
  • Moderated
  • Favorites
  • •
  • megavids
  • kavyap
  • DreamBathrooms
  • normalnudes
  • magazineikmin
  • InstantRegret
  • GTA5RPClips
  • thenastyranch
  • Youngstown
  • rosin
  • slotface
  • osvaldo12
  • ngwrru68w68
  • ethstaker
  • JUstTest
  • everett
  • Durango
  • Leos
  • cubers
  • mdbf
  • khanakhh
  • tester
  • modclub
  • cisconetworking
  • anitta
  • tacticalgear
  • provamag3
  • lostlight
  • All magazines
    •