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
-
13
votes1
answer9507
viewsWhat is -Webkit-Transform? What is it for?
So, direct I find in Csss this -Webkit-Transform, but I have no idea what it is or what it’s for and God also does not know answer me: I would be eternally grateful if someone could explain me or…
-
13
votes2
answers428
viewsIs it correct to use JS to make the effects of an HTML?
What I want to know is whether it is right to use Javascript/Jquery to do some button and screen effects, center the content horizontally and do certain tasks that can be done by CSS. The company’s…
-
13
votes1
answer1431
viewsDifference between pseudo-class (colon :) and pseudo-element (double colon :: ) in CSS
I would like to know the differences between these two concepts of CSS in order to understand and point out what one is, and what may be the other. For example: :hover, ::before. What I’ve…
-
13
votes1
answer10939
viewsWhat is parse, and how the parse of DOM works in HTML5
I started to study more CSS3 in depth, and I ended up wanting to better understand how the HTML rendering works in the Document Object Model (DOM), and how this HTML and CSS (and JS) markup is made…
-
13
votes2
answers2975
viewsIs it possible to create an input uppercase and keep the placeholder in lowercase only in CSS?
How can I leave my placeholder in lowercase and my text in uppercase in css? I’ve tried to: input { text-transform: uppercase; } <input type="text" placeholder="usuário">…
cssasked 8 years, 11 months ago Gabriel Rodrigues 15,969 -
13
votes2
answers127257
viewsPut a background image and make it responsive
I’m having a problem putting a background image on my page. I did some tests and it looks like this when I change the window size: When I maximize it’s right: How can I adjust this image to get the…
-
13
votes2
answers640
viewsWhat’s the clip property for?
I was taking a look at a code where I taught some techniques to create a responsive table. I came across the use of property clip, followed by the value rect(0 0 0 0);. Then I had this doubt: What…
-
13
votes2
answers861
viewsWhat is the best practice of styling an Email body?
I’m at the stage of developing a welcome email. I would like to know the most correct and used practice of adding the style in my email. My question is: should I use CSS inline, embedded or…
-
13
votes3
answers849
viewsHow to make a flex container have the width of internal Ivs?
Good afternoon, I’m creating a layout with height:100% where I have 2 groups, and within each group I line up the DIVs vertically and if any DIV did not fit in the height maximum or there is resize…
-
13
votes2
answers457
viewsUse "left: -9999px" instead of "display: None"? But why?
I started to wonder about that a little while ago. I read in some article, which I don’t remember what it is, that for "visibility" sake instead of using display: none or visibility: hidden should…
-
13
votes3
answers10018
viewsSASS and SCSS: Why use them instead of conventional CSS?
I hear a lot about SASS and SCSS, but I don’t know exactly how these tools work. I just know they are CSS generators(?). I found a related question here but it doesn’t address the question of why…
-
12
votes3
answers1676
viewsHow to set a max-width to a div that increases and decreases proportionally?
My div which increases or decreases proportionally is with style: padding-bottom: 75%; Look at this example: Jsfiddle What I want is that the div that grows proportionately lock the size, when you…
-
12
votes11
answers97880
viewsCenter image vertically within a div
I need to center images inside a div. I can do it horizontally with text-align:center;, but I want to centralize vertically. I tried to vertical-align: middle; and display: table-cell; and it didn’t…
-
12
votes3
answers18362
viewsHow to preview a loaded image in an "file" input?
Description: I have an example here of how my system is working. EXAMPLE LINK HTML <input type=file> <input type=button class=hide value="Adicionar outro"> JAVASCRIPT function…
-
12
votes5
answers20277
viewsHow do I use @import in a CSS file?
Inside a.css style file I am using the option @import url() to call another file CSS. For example: @import url("/css/fonts.css") Both the file and the path are correct and still I can’t import that…
-
12
votes2
answers33836
viewsVertical alignment of text with CSS
How can I align this text "Adopt the rhythm of nature: her secret is patience", vertically and horizontally within the white field? I used the following code: <ul> <li> <a> adote o…
-
12
votes2
answers4037
viewsArrows using CSS only
I would like to know if it is possible to do the following arrow using CSS only: I usually do other types of arrows, using CSS, but whenever I struggle with cases like this, where the arrow has a…
-
12
votes2
answers1619
viewsHow do CSS rules take precedence?
I know that if two CSS rules apply to the same element, the more specific one will have priority: p { color:red; } /* Todos os "p"s serão vermelhos... */ .umaClasse { color:yellow; } /* ...exceto os…
-
12
votes1
answer159
viewsWhat can be done to improve the performance of a very large CSS (384KB)
My site has a style sheet, already minified, with a total size of 384KB. If possible, what can I do to improve performance? I thought of compressing with GZIP, which would leave the sheet with 59KB,…
cssasked 9 years, 11 months ago Alexandre Lopes 2,769 -
12
votes2
answers1331
viewsWhat is the difference between Animation and Transition CSS
What is the difference between the properties animation: and transition: of the CSS?
-
12
votes1
answer832
viewsWhat is the baseline?
Studying Flexbox (layout type in HTML/CSS), I came across this concept of baseline, I’ve never seen before: align-items ... ... baseline: items are aligned so that their baselines line up Looking…
-
12
votes2
answers2820
viewsWhat’s the difference between @import of css and html Link?
I created a file containing css that are used in my system. I wonder what is the difference between calling css by link or by @import thus: /* ou dentro do codEventos.css */ @import "../padrao.css";…
-
12
votes4
answers651
viewsdisplay:One consumes data?
Some questions about what happens when we use the property display:none of css: Is the element loaded and not displayed? Or it is not loaded (and therefore does not consume data)?…
-
12
votes1
answer631
viewsWhat is SASS technology?
Nowadays dynamism in producing styles for a page or set of pages is essential for the developer. And CSS sometimes becomes somewhat complex with complicated, repetitive, and math-heavy selectors. A…
-
12
votes2
answers596
viewsHow to animate the display of dynamically sized elements with CSS only?
I’m building a site that has some state transitions using CSS only. In one of them the user clicks the header and the div below displays or hides. In the other there is a sequence of images and when…
-
12
votes2
answers7652
viewsWhat is User Agent Stylesheets?
Studying on CSS I came across the term User Agent, or standard style sheets used by browsers in case of absence of style sheets. What is the User Agent? Each browser has one User Agent? Is there any…
-
12
votes3
answers556
viewsAn image with display:None is loaded? Consume data?
I’m developing a layout responsive and would like to decrease the size of the images according to the resolution. I used the display: none but saw in the inspetor de elementos that it is being…
-
12
votes5
answers357
viewsHow to dim the blue light on a website?
I am developing a website, and would like to dim the blue light (as night mode), however, I have not found a way to do this. Is there any means by CSS, JS or some other language?
-
12
votes3
answers6427
viewsStyle input type='number' to change arrows
How to customize the input type='number' as the image below? Click on the +/- sum or subtract the number inside the box. Currently my code is: .bedrooms = f.input :bedrooms, :label => false, as:…
-
12
votes1
answer844
viewsWhat is the CSS "display: ruby" for?
The question is basically this: What’s the point of display: ruby in CSS? This attribute is new? When to use it?
cssasked 5 years, 4 months ago Wallace Maxters 102,340 -
12
votes2
answers143
viewsWhy does CSS have so many units of measurement?
After the window appeared auto-complete, I came across the following: and then I wondered: why the CSS has so many different units of measures?…
-
12
votes3
answers1020
viewsPartially paint border in CSS
I wonder if there is a way in css or even Javascript to fill only part of the border at a time, as if it were an animation in which the edge is filled little by little and have control of how much…
-
12
votes2
answers617
viewsHow to customize the default <Details> arrow?
I’m using the HTML5 tag <details> so that the user, when clicking, visualizes some information of a given word. For example: <details> <summary>JavaScript (Clique…
-
11
votes7
answers4242
viewsHow to reset CSS formatting?
It was not uncommon to go through situations where the browser itself interferes with the stylesheet by adding defaults parameters such as margin size and headers fonts, default line height. Is…
-
11
votes2
answers1010
viewsHow can I simulate a placeholder using a label?
I’m trying to get the label simulate a fixed placeholder. The biggest difficulty is changing the properties of label when the input receives the focus, and the input fill in the rest of the space…
-
11
votes4
answers2731
viewsIs it possible to change the mouse cursor color via CSS?
I know it is possible to change the style (type) of the mouse cursor via property cursor in CSS. But, does anyone know if it is possible to change the cursor color? In an application I would like to…
-
11
votes2
answers1395
viewsProblem using 'Google Fonts'
I would like to use a Google source without needing Connection (internet). I saw that the @font-face has this power. Just download the source in one of the formats (I preferred the .EOT also…
-
11
votes7
answers3042
viewsHide input value
I need to hide/remove the value from my input, but I’m not getting it at all, where am I missing? Thank you very much HTML: <div class="caixa-pesquisa"> <div…
-
11
votes5
answers10769
viewsHow to mark and unmark a row from a table by clicking on it?
When clicking on a row of a table, how to mark it by changing the color of the row background, and if you click again uncheck the background, and if you click on another row uncheck the old checked…
-
11
votes1
answer2651
viewsWhat does the CSS selector :first-Child and :last-Child mean?
I have a code using jQuery that was based on CSS selectors :first-child and :last-child (and that worked for a long time), to get the first input and the last input within a group containing input +…
-
11
votes1
answer25900
viewsIs it possible to create Android apps using HTML5?
I really wanted to start developing applications for Android phones, but I have almost no knowledge about the operating system SDK, I have more knowledge about HTML, Javascript, CSS. I have in mind…
-
11
votes5
answers17141
viewsIgnore CSS on a particular page snippet
Let’s assume I have some CSS of the type: #foo input { background-color: black; color: white; /* seguem mais um milhão de propriedades */ text-align: center; z-index: 9000; } All input son of foo…
-
11
votes1
answer99
viewsHow to create a "Glass pane" in Javascript?
I’m trying to create a "Glass malfunction" in Javascript, similar to supported by Java. The goal is to offer a kind of interactive help to the user, where information about each element is…
-
11
votes3
answers2648
viewsAutomatic calculation in text box
Good morning. Is there any way when the user type this in a text box: A script runs the account automatically and results, in this case=1 ? It is also important that it does this with all operations…
-
11
votes2
answers7980
viewsWhat’s that "Mr-only" Bootstrap Twitter thing for?
Studying the documentation I was left with doubts: for what really serves the class sr-only of bootstrap?…
-
11
votes10
answers360
viewsOrganization of CSS
Is there a pattern for organizing CSS? For example: .teste{font-family:"arial";font-size:18px;color:white} or .teste{ font-family:"arial"; font-size:18px; color:white } Which is the most…
-
11
votes3
answers546
viewsSimulate placeholder in IE8
I was reading the documentation here and it seems that the attribute placeholder does not work in IE8. Would have some way to simulate the placeholder that you use? Example of HTML not working in…
-
11
votes1
answer786
viewsBuild a "3D" building with HTML, CSS and JS
How can I play the image below using HTML, CSS and JS (maybe images)? The "floor" numbers are unpredictable and each "floor" should be "clickable", a <a href="#"></a>, or something like…
-
11
votes2
answers811
viewsHTML5 form validation
I am making a validation form using HTML5 and its own tags to validate the fields. I am using the PATTERN, that limits the character type. But it doesn’t work... Fields are not being locked. "Code",…
-
11
votes3
answers4722
viewsHow to create a box with lines on both sides with CSS only
I’m looking for a help from where to start to be able to create a fully css structure as in the image below. I know this may seem very simple, but I can’t get you started.…