Tag: CSS
-
Hiding scroll bars while maintaining scroll functionality in modern browsers
As I’ve been rebuilding my social network from the ground up recently, I’ve been extremely mindful of the fact that 60% of my users are experiencing the site on a mobile device, specifically phones. Because of this, I’ve been attempting to craft a user interface that functions nearly identical on…
-
Left align multiple line list items
I don’t claim to know all the things, and this post is definitely something that I’m pretty sure nearly everybody on the planet knew about but me. The problem I was attempting to solve recently is that I had a list and the left alignment of the multiple lined list…
-
How to !important inline styles in React
If you’ve ever used Bootstrap, you probably know that it’s pretty aggressive in it’s use of !important in it’s styles. At CrowdSync we love Bootstrap, having ditched Foundation for it, but the overzealous approach to !important does get in our way sometimes. Similar to our post earlier in the week,…
-
Using <style /> blocks in React
Every once in a while you are faced with a scenario where the best course of action is to slap a <style /> block in the middle of your code. For us, it was that time we wanted to set an arbitrary width (selected by the user) on a component,…
-
CSS :not issue in Safari on iOS9
Seems that every time that Apple releases a new version of iOS I encounter some weird rendering issue. This time around with iOS9 I encountered an issue where the full / desktop version of the site looked like it still using some of the mobile / smaller device stylings. After…
-
Layout with fixed header and independently scrolling columns
Update April 4th, 2019 Seems at some point between May of 2015 and now, the code in this post went terribly stale. It wasn’t working in either Firefox or Chrome and I’ve since updated the code with a working example. Many thanks to everybody that blew up my comments about…
-
Opt-out responsive design using LESS
I liked Chris Coyier’s post Opt-Out Responsive Design? but really didn’t like the idea of having to qualify all of my selectors with a parent class to indicate that we should be using the responsive version of the site. I do favor serving the user a single stylesheet instead of…
-
Easily identify duplicate properties in your CSS files
As of late I’ve been very adamant about DRY CSS principles. Not so much the descriptive ID and class selectors that some folks wrap their other selectors in, but the focus on not repeating the properties and grouping like selectors. I’ve even taken it a step further and have been…
-
LESS Icons for easy styling and customization
Got a new project I wanted to share with everyone, it’s called icons.less (or LESS Icons) and it’s available for immediate forking and use over at GitHub. The project itself stemmed from my own desire to have a set of social icons that were easy to customize for different websites…
-
Review: Anatomy Framework
From the developer, Nick Justice: Anatomy is a light-weight and responsive front end framework that invokes rapid development. I don’t usually review anything on here, let alone a framework, but it’s also not often that I get to use something new that’s built in my backyard of Tampa, FL. As…