Image for post
Image for post

An exciting new standard and why you may want to disable it

I learned about Scroll Anchoring a few months back and at first, I thought it was a bug. My whole team did, in fact.

The context I learned about it was when my team was rebuilding the way we present customer reviews on our website. If a customer leaves a really long review, we truncate it after a few lines and present a “View More” button to expand the rest of the review.

This was looking great, except in Chrome. In every non-Chrome browser, clicking the “View More” button would expand the content of the review down as we expected…


Image for post
Image for post

The CSS Box Model is what defines how much space an element takes up on the page. The Box Model is divided up into four major parts: Content, padding, border, and margins.

Within your web browser’s element inspector, you can look at each element’s box model. In Chrome, this is found under the Elements tab in a Styles submenu.


Image for post
Image for post

CSS Specificity is what decides what styles are applied to elements; the more specific the CSS selector, the more weight it has in determining the style of an element.

Take the following HTML and CSS as an example:

<article id="css-rocks">
...
</article>
<style>
#css-rocks {
background-color: white;
}
article {
background-color: black;
}
</style>

Q: What background color will the article element have?

A: White, since the CSS selector the white background color is more specific.

To see this in action, the element inspector will show you all the styles applied to an element in the order of specificity.


Image for post
Image for post

I’ve recently migrated my web application to run inside docker containers and use docker-compose to spin up all the required dependencies in their own containers (Postgres and Redis, in my case). This application uses Python’s Flask framework and I use pdb to debug issues.

While researching solutions, I first ran into this article by Vladyslav Krylasov that suggested adding some configuration to my docker-compose.yaml and using a module called remote-pdb with a telnet client. This worked, but it was a little more cumbersome than I wanted.

My solution was to use docker attach. First, I still needed to edit my…

Colin Miller

I’m a software engineer that specializes in front-end web development. Learn more at cjmil.com.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store