stylesheet – My Brain BLOG

Break-inside: avoid

Remember… (see source)
When using the following in CSS:

   break-inside: avoid;

also add to the same item:

   overflow: hidden;

Otherwise Firefox will give you a headache.
Have a nice day 🙂

CSS Stylesheet selectors

Selectors are one of, if not, the most important parts of CSS. They shape the cascade and determine how styles are to be applied to elements on a page.

iOS fixed layers and scrolling

If it does not scroll as expected on iOS, try:

height: fit-content;
height: -webkit-fit-content;
height: -moz-fit-content;
overflow-y:scroll;
-webkit-overflow-scrolling: touch;

That’s all! Continue reading iOS fixed layers and scrolling

prevent caching

Prevent caching?
change the HEADERS!

Cache-Control: no-cache, no-store, must-revalidate
Pragma: no-cache
Expires: 0

GOOD INFO HERE:

https://stackoverflow.com/questions/49547/how-to-control-web-page-caching-across-all-browsers

Continue reading prevent caching

iphone ipad ugly form buttons

Just correct this using CSS.

The appearance property is used to display an element using a platform-native styling based on the users’ operating system’s theme.

.thing {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}

Continue reading iphone ipad ugly form buttons

Centering things in CSS is the poster child of CSS complaining. Why does it have to be so hard? They jeer. I think the issue isn’t that it’s difficult to do, but in that there so many different ways of doing it, depending on the situation, it’s hard to know which to reach for.

So let’s make it a decision tree and hopefully make it easier. Continue reading center

Loading speed vs code readability

As a developer I like structured code. The browser however could not care less about the right amount of tabs and spacing; it just need to get the code, with as little data-traffic as possible.

So, what do I do? When speed is really important, I create my stylesheets and javascripts as I normally do, but then also convert these into a “.min’ version – minified, and refer to those from the html source code.

To get this done Continue reading Loading speed vs code readability

Tag: stylesheet