Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
In my web project, I made an extra CSS file (for example css3.css) only for CSS3 properties. That means I separated the CSS3 code from my main CSS file (style.css). It helps me maintain the CSS3 properties for cross browser compatibility issues.
What kind of problems, if any, will this create for my website? What kind of problems, if any, will this create in terms of maintenance?
Thanks
No, because there is not a strict CSS2 vs. CSS3 separation, plus it would be a nightmare to maintain.
You want to address different browser vendors with post-processors like Autoprefixer for instance.
Or target different IE version via conditional comments.
On top of that, you should deliver a single, minified CSS file of your app, rather than many separate ones [unless you have good reasons for the split, e.g. loading a separate theme for mobile devices on slow connections].
Related
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 6 months ago.
Improve this question
I have read many posts Like this one That talk about the similarities and the pros / cons of using SCSS $ vs using custom properites or var() in CSS.
I get all that and I understand the gist. My question is: Is there any overhead or degradation by forcing the browser to parse CSS variables, vs compiling the CSS and the browser just displaying the native css outputted by SASS.
We are starting a large scale project, and I am OK using custom features as I don't see a need for SCSS any longer since CSS introduced the usage of variables. I am just worried that this puts an unnecessary burden on the browser when we can just compile one time and the variables are parsed.
Am I being too analytical about this or is there something to placing the burden on the browser?
So there have been some tests regarding the performance of regular CSS —compiled from SCSS or otherwise— vs CSS w/ Custom Properties. I've done some myself with ~5k CSS variables on 10k+ HTML nodes. Those figures are similar to some of the other few articles I've seen. The performance delta is ~0.8% slower with custom properties. It's not 0, but insignificant for most reasonable use cases; we're talking >50ms differences.
I believe the actual performance issues come with style recalculation when changing variables via JavaScript. If you're using a variable declared on a parent, that is then changed, the browser will recalculate all of child elements using said variable. So better scoping and setProperty > inline styles (making changes to the HTML attribute) can give you better performance in that scenario.
Here's an interesting post on performance with this on Chrome, specifically: Improving CSS Custom Properties performance.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 6 months ago.
Improve this question
I started working on an app made with tsx. This app has a general stylesheet for everything and some of the components have inline styling. Personally it feels disorganized.
I'm a biginner at css so I don't know what would be the best way to aproach this. I thought of two options: do all inline styling or make a stylesheet for each component. The first feels wrong ,in the second I'm gonna end up with 30 stylesheets and the overrides are going to mess up everithing.
The styled-components library is universally popular and you'll find plenty of support from the large community that uses it. With this you can write your css inside your component files. I'd also recommend getting the VS-Code extension for it so that you get css intellisense.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 7 years ago.
Improve this question
I'm always looking to learn from the best and ensure coding quality.
When it come to CSS styling within my responsive designs, my custom CSS style sheet can get a bit overwhelming. Constantly hitting ⌘ + F (Control + F) to locate my classes.
I could split sections of my classes into multiple style sheets (for example: media.css, typography.css etc...) however I believe calling into to many style sheets may jeopardise performance.
What are the best practices in keeping your CSS organised and well manageable?
Keep in mind that the file structure for production does not necessarily need to be the same as development.
Split up the files logically in development and group them together as needed for production. How the files are organized totally depends on your project. Of course, this implies that you have some sort of deployment pipeline in which to concatenate the files. This is not always feasible for small websites. There are hacky ways to glob files dynamically at runtime on the server, but that adds latency to the total request time.
One important advantage to this is reusability of common styles. You could have style libraries that are included in multiple stylesheets. When you need to change the core library, you're making the change in one place as opposed to many.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
Not sure if this is a stupid question or not,
but i want to create a better looking notes database which should remind users of our companys homepage.
Is it possible to use codes extracts of the wordpress themes css code?!
It might be easier to start with the Bootstrap4 XPages plugin on openNTF and then work to skin that.
As long as CSS stylesheets don't reference by element ID, it's possible to utilise elements. However, bear in mind that parts of the CSS stylesheets you're using may get overwritten by inline styles or stylesheets from the XPages runtime itself. In my experience, you will usually need to make some modifications to the stylesheets your using, but it's doable.
Closed. This question is opinion-based. It is not currently accepting answers.
Want to improve this question? Update the question so it can be answered with facts and citations by editing this post.
Closed 9 years ago.
Improve this question
I am studying some popular CSS frameworks like Bootstrap, Foundation etc. I pointed some out, and I'm willing to make my own CSS framework whether for my own projects or in later for free distribution. As I'm a front-end developer in most of the cases, I'm a bit slow with JavaScripts. So in my study I found some challenges in making a new CSS framework, like:
JavaScripts integration for a nice, clean and easy-to-use front-end
Common and general values for a fixed layout
The menu CSS
And also I found some features a bit challenging, like:
Responsive grids (I loved it)
But is there any checklist that should be fulfilled in CSS framework?
Maybe you can try yoeman to help you create your own css framework quickly and easily.
Here is the link on the details of Yoeman generator:
https://github.com/yeoman/yeoman/wiki/Generators