Questions tagged [css]

Cascading Style Sheets (CSS) is a language for specifying the layout and presentation in general of markup such as HTML and XML.

Filter by
Sorted by
Tagged with
0 votes
1 answer
123 views

What are the points of apps like Sketch and Photoshop when it comes to Web Development?

This may be an obvious question but I really don't understand this so if someone can help me that'd be great. Basically, I am in the middle of developing an e-commerce app for my database management ...
31 votes
3 answers
16k views

Why does :nth-child() in CSS start from 1 instead of 0?

Why does :nth-child() iterate from one instead of zero? As shown in this example. Why does it select the first element and not the second when p :nth-child(1)
-2 votes
3 answers
306 views

Can display issues affect SEO?

Can website display issues on certain platforms affect a website's search rankings and potentially hinder any SEO efforts?
6 votes
3 answers
2k views

Where to put css media queries in a CSS file?

Where to put CSS media queries? Each after the related element class style or pack them at the bottom of the CSS files? which one is standard? or which one do you prefer?
0 votes
1 answer
82 views

Should I use SCSS mixins as shortcuts for default CSS syntax?

This question is mainly about readability and understanding of the code. Im am also in the process of creating a SCSS framework like Compass and Bourbon. I struggle to write SCSS because I like to see ...
1 vote
1 answer
204 views

Advantages and disadvantages of including JS/CSS inside the HTML?

What are the advantages and disadvantages of including JS/CSS inside the HTML instead of separated files? Specifically concerned about performance issues, for example, if the CSS and JS are small and ...
14 votes
4 answers
6k views

Why does Facebook obfuscate the names of CSS classes?

If you look at the source code of a website such as Facebook, you'll see many classes as such: <div class="_cy6 _2s24"><div class="_4kny"><div class="uiToggle _8-a _1kj2 _4d1i _-57 _5-...
1 vote
1 answer
119 views

Semantic Versioning for CSS

I maintain a CSS framework that is versioning with semantic versioning. What changes to a CSS framework are considered major, minor, and patches? Specifically, what is the "API" of a CSS ...
32 votes
3 answers
11k views

What makes BEM better than using a nestable style sheet language like LESS?

A colleague of mine is heavily pushing the BEM (Block Element Modifier) method for the CSS in a project he's helming, and I just cannot comprehend what makes it better than the LESS CSS we've been ...
5 votes
1 answer
1k views

Finding the smallest sub-collection of sets that intersect to produce one element

I came up with a problem that's similar to the Set Cover problem but which I can't reduce down to any know problem. Does anyone have a good algorithm for solving this? Given a set of elements U = {1, ...
-3 votes
1 answer
75 views

Choosing between network optimisation and CPU usage in clientside web development [closed]

I'm working on a CSS library that includes hundreds of selectors and rules for quick templating instead of writing regular CSS. This is used as a replacement of attr() CSS function until it works for ...
9 votes
3 answers
630 views

"CSS first" vs "HTML first" (Bootstrap, SASS)

Kind of a follow-up to Should I write HTML or CSS first? On a relatively large website, we are considering to use SASS and/or Bootstrap. From previous projects, there seem to be different ways to go ...
-3 votes
1 answer
49 views

doesn't inline-styling represent separation of concerns concept the best way if you think that you're separating the HTML element from other elements?

I know that Inline CSS styling gets so much hate from many developers, and I understand that some of this hate is justified by the following facts: Inline styles increase page size as they don't get ...
16 votes
4 answers
42k views

Will it be a wrong idea to have <style> in <body>?

In below code i placed internal style sheet with in body tag, instead of having in head. For Single-Page-Application I am considering to do this for styles that is only applicable to that page alone, ...
-1 votes
2 answers
1k views

How to best do cross-browser cross-platform visual CSS regression testing? [closed]

Background: Visual CSS regression testing is where you screenshot (part of) one version of a webpage in a browser and compare it against a screenshot of the previous version of the same webpage in the ...
-4 votes
1 answer
778 views

How do I set a darker background color on hover *without knowing the original color*?

I've tried everything related to filter and backdrop-filter, but nothing seems to work. I've searched online but not found a single article addressing this (which is odd). I simply want to set the ...
2 votes
0 answers
899 views

Setting width/height of unknown images for lazy loading

I have a site where users upload images & can all be viewed on a single page by other users. I want to lazy load images as the user scrolls instead of loading all initially. This is easy enough, ...
-1 votes
1 answer
413 views

What are downsides to opening local html files in the browser?

Let's say you have a scenario where you want to build a simple web stack (html/css/js) prototype to share with someone. I am a little unclear on whether or not I want/need to use a small web-server to ...
-3 votes
3 answers
664 views

Repeating CSS class contents. Structuring css code

I'm a backend developer working on a webpage, building the CSS part. I like to write as less code as possible and reuse them throughout the site, a lot of pages. I want to be able to reuse some CSS ...
1 vote
3 answers
931 views

Reasons for moving from raw JavaScript to a JavaScript library

Being aware of the direct benefits of libraries having things wrapped in a package, making daily work easier, my question is leaning more towards the fact that many features not implemented in HTML/...
2 votes
1 answer
165 views

Best practices for positioning elements in an HTML-based game

It seems like HTML5 has about a zillion different layouts and methods for positioning divs, few of which seem to work exactly as described in most browsers. Imagine an implementation of, say, Tetris ...
-3 votes
1 answer
63 views

How would you architect a simple cascading style sheet object?

How would you architect a simple cascading stylesheet like inheritance object? For example, I have Apple that extends Fruit. class Fruit { constructor() { this.total = 10; } } ...
6 votes
6 answers
2k views

Why Have People Started Deeming it Necessary to Separate JS hooks from CSS hooks in HTML?

Edit: Point of clarificatioon, IDs and classes as separate hooks is just one form of the applied idea in question which is to never use the same hooks for CSS as you do in JS. I've also seen people ...
6 votes
2 answers
462 views

Why don't web browsers know the physical dimensions of a display?

CSS is a syntax for specifying the appearance of text and other web content, sizes and lengths are defined in pixels, however pixels have different sizes in different devices, this is the most notable ...
-3 votes
3 answers
134 views

What are some of the best ways to create single page websites with dynamic content?

I'm expirementing with creating a website as a IT Ticketing system. This website has a top nav and a side nav. I want the content area to change depending on the link clicked. I've managed to get the ...
0 votes
5 answers
3k views

Is it a good idea to use width and height properties with the < td > tag?

I am new to HTML and Im working on a self made project and I have to use < table > and < fieldset > tags in my html files. I need to set the width and height properties to the tables like <...
3 votes
1 answer
187 views

How can I properly classify elements?

I'm writing a webpage with a simple header, nav, body and footer layout. To style it, I wrote the following CSS: .mainSideBar { position: relative; display: inline-block; vertical-align: ...
1 vote
2 answers
808 views

Is JavaScript added and executed in parsing or in rendering?

As far as I know, each webpage is created in a two stage process, initiated by a webserver request and ended in a webserver response: Parsing: markup (Say HTML) is executed as is, or created by ...
1 vote
0 answers
26 views

How to increase scalability the method that output each file while switching multiple many conditions?

I have a common style (common.scss) and a text direction (RTL, LTR) option file (option-document-direction-rtl.scss, option-document-direction-ltr.scss). And by switching the reading of these files, ...
-1 votes
1 answer
165 views

Inline HTML elements don't allow setting "width" - why is that?

In HTML/CSS, inline elements, such as <span>, do not support explicitly setting their width via the width CSS property. This is confusing to many developers, as questions like "Setting the ...
13 votes
2 answers
13k views

How to namespace your CSS?

As far as I know there are two types of CSS namespacing: Prefix one: .myapp-alert {...} and class one: .myapp .alert {...} Which one is preferable? Does one has benefits over the other one? Are ...
5 votes
8 answers
3k views

Can CSS be considered a DSL?

According to Wikipedia, CSS is a style sheet language. However, it's pretty much the only such type of language in use (at least from a web developer's perspective). When trying to categorize CSS as ...
1 vote
2 answers
2k views

Do I need to put a license in my website's HTML and/or CSS?

I am making a website for a competition my school is taking part in, however I am not on the team and am not receiving any compensation (save for better references :P). The only condition I have set ...
4 votes
2 answers
2k views

Are there any frameworks available for drawing with CSS?

I realize this sounds silly. Let me explain: I just came across this page about using CSS elements to create shapes- square, circle, triangle, star, yin-yang (yin-yang!), etc. using pseudo elements. ...
-4 votes
1 answer
767 views

Why isn't React recognizing the CSS file I've linked in Index.html?

I've built a meme generator using React as an early project to master the basics. I have 6 files in my "mememaker" folder on my desktop, which I created using "create-react-app". They include: index....
0 votes
0 answers
500 views

Elegant way to prevent global CSS styles from being inherited by views (C#, ASP)

I've been working on a web app that's divided up into different web pages (around 20). It's only used within my company and it looks at financial data. It's a few years old and is in dire need of an ...
6 votes
4 answers
9k views

When should I use a CSS class over inline styling?

I have some hidden divs that I show via JavaScript when a button is clicked. Right now, I'm hiding them with by using inline styling (i.e. style="display:none;"). This works, but are there general ...
3 votes
2 answers
133 views

Why create CSS classes named to match one specific style? (non-semantic class names)

There are a number of CSS frameworks that have a one-to-one correspondence between many of the classes and a single style. For example, in basscss ".inline-block" is defined as "display: inline-block;...
7 votes
6 answers
14k views

What to use instead of IDs in selectors in CSS

I recently installed a csslint package for my Atom text editor. I keep getting warnings saying "Don't use IDs in selectors." I found this weird since I've always been using IDs in selectors in CSS, ...
293 votes
8 answers
200k views

Why are people making tables with divs?

In modern web development I'm coming across this pattern ever more often. It looks like this: <div class="table"> <div class="row"> <div class="cell"></div> ...
0 votes
2 answers
3k views

Is there a rule of thumb when it comes to the "name" attribute?

Since there is things like BEM in naming conventions for HTML class attributes, does the name attribute have anything of that sort?
43 votes
7 answers
12k views

Why not embed styles/scripts in HTML instead of linking?

We concatenate CSS and JavaScript files to reduce the number of HTTP requests, which improves performance. The result is HTML like this: <link rel="stylesheet" href="all-my-css-0fn392nf.min.css"&...
28 votes
10 answers
19k views

Should I write HTML or CSS first?

There are a lot of analogies for HTML/CSS development; which can be a bit confusing for a beginner. HTML = foundations/house CSS = walls/blueprint/wallpaper Is there any best practice here? Which ...
1 vote
0 answers
1k views

Bootstrap components and SMACSS/BEM methodologies

I have no enough experience in web development and I need advice from more experienced developers. I have been exploring SMACSS and BEM methodologies for a few weeks, and I like them, it makes really ...
0 votes
1 answer
100 views

Abstracting a CSS framework in an enterprise web application

Our team is attempting to "modernize" an old ASP.NET Web Forms application. One aspect we want to improve is its visual style as it looks very dated by today's standards. Additionally, its existing ...
4 votes
1 answer
96 views

Bootstrap classes in SCSS or HTML?

If I had a development workflow that supports SCSS and uses bootstrap. I can place bootstrap tags two ways... Inside the HTML: <div class="col-sm-3 offset-sm-9 col-xl-1 offset-xl-11"> Part of ...
6 votes
5 answers
3k views

Is it a bad practice to use inline styling with generated code?

If I'm using a technology like Grails. It's really easy to wind up with inline styling. Are there any downsides to auto-generating code with inline styling? Is this considered bad practice? Why?
0 votes
1 answer
107 views

ReactJS - proper way to handle a responsive design approach?

I've always used CSS and media queries when it comes to responsive design. I've been developing in ReactJS for a while, but I feel my approach to responsive design is sloppy. I find myself using a mix ...
1 vote
1 answer
892 views

How to white label my website in php

I have a website that follows the following structure: www.example.com/city1 www.example.com/city2 ... Programmatically we change the logo which is hard-coded in a specific config file for city 1, ...
3 votes
2 answers
130 views

What are CSS modules? Are they a library, or a spec, or what?

So there are a fair few blog posts about that introduce CSS modules. For example: the official documentation: https://github.com/css-modules/css-modules a post from CSS Tricks: https://css-tricks....

1
2 3 4 5 6