Discussion
Loading...

#Tag

  • About
  • Code of conduct
  • Privacy
  • Users
  • Instances
  • About Bonfire
Terence Eden
@Edent@mastodon.social  ·  activity timestamp 5 days ago

Please help me out CSS friends.

My container is 660px wide.
I've set the font size to be 10cqi.
There are 10 monospace characters.
Why isn't each of them 66px wide?

Have I misunderstood how container queries work?

#CSS #WebDev #HTML

Screenshot of browser tools showing the resulting mess.
Screenshot of browser tools showing the resulting mess.
Screenshot of browser tools showing the resulting mess.
  • Copy link
  • Flag this post
  • Block
Matt Godden
@metaning@mastodon.social  ·  activity timestamp 5 days ago

So any #WebDev #Webkit #WebDesign folks: I've been hacking #HTML (and later) #CSS for almost 30 years... why is webkit showing this white hairline around the edge of an element, between the box-shadow and the box background (which are supposed to be the same colour, but the shadow ends at RGB 12, 12, 12 whereas the box background is RGB 10, 10, 10). Graphics driver issue?

I'm really tempted to just #FuckThisImUsingTables as a cutup (remember those?) with baked-in alpha png backgrounds.

An image of the Webkit inspector showing white hairline artefact around the edge of an object. It appears and disappears based upon the zoom in the browser window. Also, the RGBA Background colour of the div is two percent darker than the same RGBA value at the last pixel of the box shadow.
An image of the Webkit inspector showing white hairline artefact around the edge of an object. It appears and disappears based upon the zoom in the browser window. Also, the RGBA Background colour of the div is two percent darker than the same RGBA value at the last pixel of the box shadow.
An image of the Webkit inspector showing white hairline artefact around the edge of an object. It appears and disappears based upon the zoom in the browser window. Also, the RGBA Background colour of the div is two percent darker than the same RGBA value at the last pixel of the box shadow.
  • Copy link
  • Flag this post
  • Block
Terence Eden
Terence Eden boosted
Mia (web luddite)
@mia@front-end.social  ·  activity timestamp 2 weeks ago

For spacing values on a website – is it better to respond to font-size, or available space, or stick with static units?

You don't have to choose! Sometimes the best unit in CSS is a combination – with calc()/clamp() or min()/max() or round() & other math functions.

https://www.oddbird.net/2025/09/23/type-units/ #css

OddBird

The Best CSS Unit Might Be a Combination

We don't have to choose between px and rem for spacing
  • Copy link
  • Flag this post
  • Block
Log in

Open Science

We are a network of scientists, developers and organizations building the next generation of digital spaces for open science.

Open Science: About · Code of conduct · Privacy · Users · Instances
Bonfire open science · 1.0.0-rc.3.6 no JS en
Automatic federation enabled
  • Explore
  • About
  • Members
  • Code of Conduct
Home
Login