Most voted "css" questions
Cascading Style Sheets (or simply CSS) is a style language used to define the presentation of documents written in a markup language, such as HTML or XML. Its main benefit is to provide the separation between the format and content of a document.
Learn more…8,314 questions
Sort by count of
-
79
votes4
answers6695
viewsIs it possible to make a tooltip with pure CSS?
Is it possible to make a tooltip with pure CSS? That is, without jQuery, without Javascript, but only with CSS. For example, I want to do this based on the following element: <a href="#"…
-
73
votes18
answers139957
viewsWhat is the best way to center an element vertically and horizontally?
What’s the best way (by "better" I mean: with the greatest possible compatibility between browsers and the simplest possible) to position an element in the center of the page, vertically and…
-
64
votes3
answers1321
viewsWhy is it not recommended to use "_" (underscore) in HTML/CSS?
I’ve seen people recommend never using _ (underscore) in HTML and CSS. Instead, we should give preference to -. Example: // Errado <div id="minha_div" class="minha_classe"></div> //…
-
57
votes2
answers3691
viewsWhat is DOM, Render Tree and Node?
I’m a beginner in JS and try to understand the theory, but all the articles I find on DOM are too "scientific". There wouldn’t be a simpler way to explain this to a "layman"?
-
55
votes2
answers36477
viewsWhat is the purpose of the declaration "! Important"?
What is the purpose of the declaration !important in the CSS? body { font-size: 12.5px !important; }
cssasked 9 years, 10 months ago user7261 -
52
votes2
answers36638
viewsWhat is the difference between SASS and SCSS
I have been reading about SASS for some time and it provides a powerful feature set for CSS as variables, mixins and the like. And at the same time I see the term SCSS. What’s the difference between…
-
49
votes2
answers40509
viewsWhen to use Absolute or relative position in CSS?
I know an element inside with position absolute does not respect the boundaries of the parent div and that relative respects, and theoretically positions itself in relation to itself. My doubts are…
-
47
votes4
answers40074
viewsWhat is the difference between display:None and visibility:Hidden?
I know you’re both hiding the element, but there’s actually a difference between: #foo{ display:none; } and #foo { visibility:hidden; }…
-
45
votes5
answers76380
viewsHow to pin a "horizontal menu" to the top of the window when scrolling the page?
I have a layout with a horizontal navigation bar at the top of the site, it is with margin-top:100px, when scrolling the page the menu should be fixed at the top of the window but with margin-top:0.…
-
45
votes3
answers3408
viewsHow to find out if a hexadecimal color is dark or light?
I have a status listing that is displayed and each status has an assigned color. These colors are saved in my database in hexadecimal format. Example: #add555 I have a small problem: If the color is…
-
44
votes5
answers87966
viewsHow to print content inside a HTML div?
I have a page and in it the content I want to print. I created a Javascript command, but this command prints the whole page. Is there any way to print only the contents of a div?…
-
40
votes6
answers20110
viewsHow to center the content of an element vertically?
I’m trying to center vertically the content of an element that has position: absolute. I was able to move the content from half down container, however, from half up the space is "left". How can I…
-
40
votes2
answers897
views<br> is obsolete?
With the advent of responsive/adaptive/fluid layouts, the use of <br> to define layout spacings. Using it is not recommended in these modern layouts or is it just a matter of programming…
-
37
votes3
answers8575
viewsWhy is it recommended to use the "in" unit instead of "px" for fonts?
I see some sites when defining the font-size use the unit em, in a brief survey I read that it is recommended to use em in sources for being better than unity px. After all, what would be the right…
-
37
votes2
answers71704
viewsHow to make image responsive
I am working on a site with responsive feature and in it I have a promotions page and I would like the images to follow the browser size change, the maximum size of the image width is 1080px,…
cssasked 9 years, 3 months ago adventistapr 5,498 -
37
votes9
answers34793
viewsInput type="password" with password display eye
I need to put a <input type="password"> with that eye of the reveal password, but it has to work as follows: User clicks on the eye and when dropping hides the characters again. Follow an…
-
37
votes1
answer3274
viewsWhich CSS selector has priority?
I have the following code HTML and CSS: #element p{color:blue;} .element p{color:red;} div p{color:pink;} div.element p{color:yellow;} div[name="element"] p{color:purple;} div…
-
37
votes3
answers10654
viewsHow to make a progress bar ranging from 0 to 100% with CSS only?
I am developing a page where there is a progress bar and I need to make it start from 0 and go to 100%. But I only need to do it with CSS and, in addition, I need that when it reaches 100%, start…
-
36
votes8
answers309745
viewsReduce image size and maintain CSS aspect ratio
If I have a horizontal image (320x205), <div class="container"> <img src="imagem.jpg" width="320" height="205" /> </div> and I put the CSS rule .container img { max-width: 200px;…
-
36
votes4
answers39339
viewsHow to apply readonly in a select?
I believe most of you here know the difference between readonly and disabled. Select Readonly The readonly does not apply properly to the select <select name="field" readonly="readonly">…
-
35
votes1
answer830
viewsWhat is the difference between "element element" and "element>element" selectors?
I was looking at the code of Twitter Bootstrap, and found this CSS: .table-condensed > tfoot > tr > td { /* ... */ } In the sense of functioning, what would be the difference of placing…
-
35
votes6
answers24229
viewsWhat is the difference between padding and margin in CSS?
From what I understand I see a retreat from another element when defined the properties left, top, right e bottom. There is a difference between margin and padding in the CSS? An answer with…
-
33
votes3
answers154319
viewsHow to center horizontally one div within another?
How can I center a horizontal div that is inside another div using only CSS? In this case, we can assume that div external outer has a width of 100%. <div id="outer"> <div…
-
32
votes5
answers5370
viewsHow to apply ! CSS import via jQuery?
I’m trying to apply style to my element and define its importance in this way: $('div').css('height','50px!important'); But it doesn’t work, which would be the right way?…
-
30
votes4
answers1879
viewsIs it necessary to add prefixes to some CSS properties?
In many codes the browser compatibility prefixes are added in CSS attributes. Example: .exemplo { -webkit-background-size: 50% 50%; -moz-background-size: 50% 50%; -o-background-size: 50% 50%;…
-
28
votes10
answers68840
viewsHow to make a <div> occupy the entire page width but leave a gap of a few pixels on each side in CSS?
I’m trying to make a header that should fill the entire page width, but leaving a 5px gap on each side. For example: | ::::::::::::::: | | ::::::::::::::: | In this case the Pipes are the maximum…
-
28
votes2
answers3688
viewsWhat are the advantages and disadvantages of minifying Javascript scripts?
And which mini-guards can I use?
-
28
votes4
answers62720
viewsHow to style a "file" input?
I have this structure: <section id="cadastro" class="cadastroVersao pg-i"> <div class="titulo"> <h1><i class="icon-clientes"></i>Cadastro de versão</h1> <a…
-
28
votes2
answers1630
viewsWhat does the + sign in CSS mean?
For example: .input__field--minoru:focus + .input__label--minoru::after { } I’m having an effect here, but I don’t understand this sign + you have in the framework. Final Result…
-
28
votes3
answers466
viewsComments weigh in?
Comments weigh? I leave comments throughout my code, will influence something on the site? I’m saying more specifically in HTML, CSS, Javascript, PHP.
-
27
votes9
answers37388
viewsWhat should I use in CSS, id, or class?
I started practicing html and css and some questions arose: When creating a style for an HTML element what should I use in CSS, class or id? What are your criteria for choosing what to use in CSS?…
-
27
votes5
answers4828
viewsWith CSS is it possible to put 2 colors in 1 letter? Or half the text with a different color?
I wonder if with CSS you can leave only half a letter, or half a word, with another color and the other half with another? It would be possible to get this result from the image below only with CSS?…
-
26
votes2
answers5355
viewsGet colors from the image
There is a possibility (with plugins or not) to catch the [main] colors or the predominant colors, similar to Adobe Kuler, image? Example I have this image: And I wanted to take her main colors,…
-
26
votes2
answers14336
viewsSome way to style "parent" element with CSS
Hello, is there any way to select the parent element of another element with CSS? To be more specific, I’m studying on localhost using the phpBB3 forum platform, when a message is thankful it wins…
-
26
votes4
answers5242
viewsWhat is the priority of HTML? "id" or "class"?
I would like to know if HTML is a priority id or class. For example, if I’m assembling my structure and do the following: <div class="teste1" id="teste2">TESTE</div> What will he do?…
-
25
votes1
answer55331
viewsHow to style the scroll bar?
Good, I’ve been spending some time looking for solutions to this but I can’t find it, I have a scrollbar And I’d like to take your size down. Can someone point me to a website or tell me what it…
-
25
votes2
answers1645
viewsWhat are the structural and syntax differences between Sass, Less and Stylus?
Nowadays it’s hard to see people writing "old-fashioned CSS" because of pre-processors that make it easy to write by removing code repeats, and syntax simplification. I would like to understand what…
-
24
votes4
answers7004
viewsCreate a triangle with CSS
Squares that have the color of an item can have up to two colors that in the latter case should be displayed as shown below: Both colors are applied to the CSS property background. What is being…
-
24
votes7
answers16899
viewsHow to create a <select> with images in the options?
I thought I could make one select simple html with image, but does not work. I’m starting to think it’s a problem with modern browsers or HTML5. CSS select#gender option[value="Prima"] {…
-
23
votes8
answers44013
viewsHow to remove auto complete input from google Chrome?
I want to remove yellow background when this enabled auto complete from Google Chrome. I tried to disable auto complete by applying: autocomplete="off" and I was unsuccessful. The top image is the…
-
23
votes6
answers15200
viewsWhat is and how does Bootstrap work?
I did some research, but most of the articles I found are based on the assumption that the reader already has some familiarity with frameworks (which is not my case), that I still have only a vague…
-
23
votes1
answer294
viewsWill-change CSS property: when to use?
According to the W3C specification, the property will-change is intended to inform the browser which CSS properties will be modified so that it can perform optimizations on the elements in question.…
-
22
votes4
answers13539
viewsHow to prevent a click on a link/anchor or tied event element
In the case of a link: <a href="http://www.google.com">Google</a> or in the case of another element having an event tied with addEventListener, what alternatives exist to prevent the…
-
22
votes6
answers14122
viewsHow to simulate a higher resolution screen to check the behavior of a website?
Is there any way to simulate a higher resolution screen to check how a website behaves? I currently use 1440x900 and need to test the interface at higher resolutions.
-
22
votes3
answers742
viewsHow to improve the performance of static files on a website?
My site has 10 sheets of styles (CSS) and 15 scripts (Javascript / jQuery), outside the images, this influences a lot in loading. In your opinion, what is the best way to make the site…
-
21
votes4
answers15388
viewsHow to make a table responsive using (Twitter) Bootstrap?
I’m working on a web application using Ruby On Rails 4 and much of the interface consists of tables. I would like you to suggest a way to detect the screen size in use and, based on this, hide…
css ruby-on-rails twitter-bootstrap ruby responsive-layoutasked 10 years, 5 months ago Wilson Canda 315 -
21
votes2
answers15006
viewsHow to prevent content selection with CSS?
How to prevent text/content selection from my CSS web page? This would be extremely useful for buttons, anchors, tags and other elements that could be selected without user interest...
cssasked 10 years, 5 months ago Kenny Rafael 6,698 -
21
votes6
answers18042
viewsHow to make a Custom Scrollbar?
How to modify a scrollbar div, to appear as in the image example below (Hangouts), instead of the standard operating system scrollbar?…
-
21
votes5
answers2054
viewsWhy put Javascript, CSS, and images on another server?
On most sites I noticed that they use another server to load scripts, CSS and images. Because they use?
-
21
votes2
answers1671
viewsIs it possible to add an overflow behavior with scroll only in tbody of a table?
It is possible to add a behavior of overflow with scroll only in the tbody of a table and still not have to set fixed sizes in pixels, without having to separate the column header with the body, as…