Today I Learned | Kybercode

Cooper Gidge on May 28, 2025.

So overflow-wrap: break-word and CSS Grid don't work well together. But using minmax(0, 1fr) instead of just 1fr fixes it.

This defaults the min-width of the column to 0 instead of auto. For whatever reason, min-width: auto causes problems.

<div class="grid">
    <div><p>Without <code>minmax(0, 1fr)</code></p></div>
    <div><p>This div contains a very long word: someveryveryveryveryveryverylongword</p></div>
</div>
<div class="grid grid-2">
    <div><p>With <code>minmax(0, 1fr)</code></p></div>
    <div><p>This div contains a very long word: someveryveryveryveryveryverylongword</p></div>
</div>

.grid {
    display: grid;
    /* this doesn't work... */
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    max-width: 400px;
    margin-bottom: 8px;
}
.grid div {
    /* overflow-wrap: break-word isn't working... */
    overflow-wrap: break-word;
    border: 3px dashed #FF0000;
}
.grid-2 {
    /* this DOES work... */
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
}

false

Result

HTML Today I Learned Web Dev

Cooper Gidge on May 4, 2025.

What's the difference between readonly and disabled in form controls? I found myself asking this question when implementing a very specific feature.

I'm making a form to send data, but I also want to include some generic information that the user doesn't need to enter. So I added another <input> element and gave it a visually-hidden class. But then I was faced with a question...do I set it to disabled or readonly?

After consulting this thread, I settled on readonly because it appears that the value of disabled inputs won't be sent when the form is submitted.

Embeds Today I Learned

Cooper Gidge on Dec 14, 2024.

When using oEmbed on Discord, make sure you include your website domain in the discovery URL. In my <head> element, I specified my oEmbed support like:

<link type="application/json+oembed" href="/path/to/oembed.json">

But Discord (truth be told, they're all I checked) wasn't including it in their embeds until I changed it to:

<link type="application/json+oembed" href="https://www.example.com/path/to/oembed.json">

So maybe it's not a bad practice to include the site domain in all href attributes.

Efficiency Today I Learned

Cooper Gidge on Nov 26, 2024.

Today I learned that print statements cost more than you think. I had a program that needed to perform a calculation...100 million times. I, in my wisdom, had it print what it was doing...100 million times.

When I ran it with print statements, it took over an hour to complete. When I removed the print statements, it took seconds.

It turns out even tiny bits of inefficiency can add up. Who would've guessed?