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
-
6
votes3
answers218
viewsIs it possible to load alternative . css links in case the primary link is not working?
Not really a problem, but a question that can solve several of my problems. Let’s say I upload this CSS file to my website: <link href='http://host-1.com/style.css' rel='stylesheet'…
-
6
votes3
answers17188
viewsApply CSS when two classes are together
How to apply a CSS setup only when a tag is with the classes nome1 and Nome2 at the same time? I tried with the following code, but it’s not working. Does anyone know how to do? .nome1 { color:…
-
6
votes2
answers2044
viewsHow to keep Ivs aligned on top of each other?
- I am extremely new to the subject and do not know much, I am going from searches on the internet, videos and readings, I say this in case there is some code or unnecessary rule in my doubts I…
-
6
votes3
answers759
viewsCenter menu on page
I am trying to align the menu I have centrally, but the attempts I made were frustrated and my knowledge in css I tried to change it here: #topNav ul.nav>li.mega-menu { position: unset; } The css…
cssasked 6 years, 5 months ago adventistapr 5,498 -
6
votes1
answer1139
viewsWhat is the usefulness of :host, :host() and :host-context()
What is the usefulness of pseudo classes :host, :host() and :host-context()? If possible with some practical example
-
6
votes1
answer105
viewsWhat is currentColor and how do I use it in CSS?
What is the currentColor attribute in CSS? What is this attribute for and how best to use it? I would like some examples to better understand. If the element does not have a color or if the color is…
-
6
votes1
answer376
viewsHow to specify a time when changing colors with :Hover?
<a href="#">link</a> a:hover{ color:blue; } With this script I can change the color of the text "link" when the mouse hovers over, but the color is changed instantly. I wanted the color…
-
6
votes2
answers91
viewsWhat is the Hanging-punctuation property for and how?
I know the property hanging-punctuation provides a control over typography on the web, but I’m not sure what this control is and how it works. I also saw that the property supports some values, such…
cssasked 6 years, 1 month ago João Pedro Schmitz 2,974 -
6
votes3
answers4549
viewsAlign span right inside div
I’m doubtful how to align a text within span as an example: This is my HTML I need to leave it like this, left text aligned on the right and left text aligned on the right, as an example: HTML:…
-
6
votes1
answer76
viewsAre all the Fontawesome folders useful?
I use Font Awesome 5.2 just this way to insert the icons: <i class="fab fa-500px"></i> I wonder if for this it is necessary to leave in the project all these folders and files that comes…
-
6
votes5
answers9207
viewsChange the color of the text by clicking a button
<html> <head> <meta charset="utf-8"/> <style> .alterar{ color:red; text-align: justify; } </style> <title></title> </head> <body> <h1>…
-
6
votes4
answers1595
viewsLeaving div height equal to width using css only
Let’s say I have 4 div, with the property width:25%. In a space of 1000px, this 25% would represent 250px. <div style="width:1000px"></div> <div style="width:25%;"></div>…
cssasked 7 years, 5 months ago ivan veloso 2,900 -
6
votes2
answers465
viewsForce CSS and JS cache clean
I work with a server. Whenever I change my CSS/JS and upload to the server, it does not directly change the version of my file, it is cached. I mean, I always have to clear the cache and then see…
-
6
votes5
answers964
viewsHow to progress steps using thread chart?
I am developing a screen using the student’s progress, for example, he has 10 activities to complete, and is in activity 2, so this represents 20% of the total activity. I’d like to represent that…
-
6
votes1
answer657
viewsWhat is and how does the "clamp" function work in CSS?
Recently I’ve seen some people talk about the function clamp. What is its real usefulness? Is there any relation to other functions, such as max or min?…
-
6
votes2
answers991
viewsIdeal attribute not to be 'clickable'
Good afternoon. I am making a button that has the function of increasing the quantity of products in the cart. However, when you click it many times, the element is 'colored' as if it were a word or…
-
6
votes2
answers3042
viewsIncreasing/decreasing number effect
I searched the Sopt and I couldn’t find what I wanted Suppose I have one button and, when carrying out a click, he alter the value of some div or input. The initial value is 1, and to the click on,…
-
6
votes3
answers2842
viewsSwap the image on smaller screens
I have the following code: <div class="container-fluid"> <h1> Áreas de Atuação </h1> <div id="hr-atuacao"> <hr> <div class="card-columns"> <div…
-
6
votes1
answer500
viewsPure CSS for circle progress
I’m trying to make a circle of progress, but I’m not making it. I want it exactly this way. I want a black circle. A gray border smaller than that circle, like 5px less. A circle that is progress. I…
cssasked 7 years, 1 month ago Diego Souza 16,524 -
6
votes1
answer172
viewsText around image/round div
I’m in doubt on how to get the text around the round/div image. Follow the example: Maybe we could start like this: html <div id="texto-esquerdo"> <p> Lorem Ipsum é simplesmente uma…
-
6
votes2
answers466
viewsbox-shadow pick up the four corners of the image
Can anyone tell me how I leave the box-shadow in the same tone as the right and the top on the left and the bottom? http://prntscr.com/j3lwl7 HTML: <div id="wrapper_login"…
-
6
votes1
answer5362
viewsCSS gradient with image
I need to develop a responsive web page, I’ll put a background image as "texture", but they can’t occupy the entire screen, only half, giving a fade transition, between the image and the white part…
-
6
votes3
answers1082
viewsHow to style "broken image" (when image does not load)
How would it be possible to make a CSS style for when the image is not loaded on the page? When you have the link to the image, but for some reason it is not loaded on the page, or if the link or…
-
6
votes3
answers418
viewsIs it possible to create a letter seal element with CSS?
What is the best way or way to build an element similar to a CSS-only Letter Seal? (at the moment I didn’t want to have to use SVG) I’m trying to build this shape with HTML/CSS and the option I have…
-
6
votes3
answers320
viewsOn fixed footer position only at the bottom of the page
I have a layout with menu fixed to the left, the page content occupying the rest of the space and a footer also fixed: * { margin: 0; padding: 0; text-align: center; } nav { z-index: 2; width: 25%;…
-
6
votes1
answer525
viewsHow to place a Video inside a CSS Text? Is it possible to place a Video as a text background?
I saw this effect and I’m trying to put in a project, but I don’t know how to put a Video inside Text, I only got with images... Here I put an image as text background, but how do I put a video like…
-
6
votes1
answer197
viewsWith CSS, is there any way to change the style of Text-Overflow:Ellipsis?
Imagine I have a situation where the text is bigger than the container, then I’ll use text-overflow: ellipsis to place the 3 dots ... showing that the text continues and there inside the container…
-
6
votes2
answers169
viewsAnimation with Javascript/jQuery
I have this html: I wish that when the user dragged, the buttons would appear like this: When you drag it again, disappear ... How could I do this with Javascript/jQuery? Follows the code: <div…
-
6
votes3
answers362
viewsCharset statement in file . css
Sometimes I come across some examples of archive .css with the declaration of charset right in the first line: @charset "utf-8"; Even my code editor (Dreamweaver CC 2015), when I create a new CSS…
-
6
votes1
answer183
viewsHow to make animation with SVG or CSS of a Text walking the way?
I have an SVG that is a Text aligned on a Path. But my intention is to do the text "running" by Path, as a Marqueer. The idea would be something like this image. But what I got was to animate the…
-
6
votes1
answer102
viewsAdd a distant circle around a CSS image
I need to circle around a div with photo, however my image is not centering on the expected circle, having this result: I tried to do it that way: #avatar { margin: 0 auto; background-image:…
-
6
votes1
answer1040
viewsMake edge effects in CSS such as chamfer
I need to do some effects on the edges of images and rectangles, as in the image below: Notice that they are in the corners, in the gray rectangle this in the top right, in the images in the base…
-
6
votes1
answer332
viewsHow to make the border thickness responsive to this Brazilian Flag made with CSS?
I’m trying to make a flag of Brazil that is responsive. But I came across a problem with the white banner of the flag. OBS: I won’t put the text on the track! What happens is that the track is…
-
6
votes1
answer453
viewsWhy is Serif Font used so little on the Web and in Apps?
I do not seek answers based on opinion! The other day I saw one Kindle, and I noticed that he was using by default a font-family with serif. What is a serif source After that I was asked. Amazon…
-
6
votes2
answers372
viewsWith CSS to make a color shadow on a text?
I saw this text template and I thought it was pretty cool, so I tried to replicate it and it didn’t work out so well... In fact I even managed to put a gradient that pleases me inside the text, but…
-
6
votes2
answers162
viewsCentralize Divs responsibly
Next, I always looked for a solution to this type of problem, but never found. I have the following codes. <style> .allboxframes { margin: 0 auto; max-width: 100%; } .box-frames { margin: 0…
-
6
votes2
answers301
viewsDiv with position: Fixed loses total container width
In the example below, see that the div naturally occupies the whole width of the body, but when I click the button Fix to change the property position for fixed, it loses its full width, looking…
-
6
votes2
answers73
viewsWhat makes a code have different visual representations in different browsers?
I have a website that I am developing on which I have a top set menu (a navbar). The problem is this navbar has different views on Chrome and Firefox. I’d like to know why this is happening. I use…
-
6
votes1
answer145
viewsHow to detect screen width smaller than height with CSS?
I have a div with position: fixed which occupies the entire screen and which is only displayed when the width of the screen is less than the height. With Javascript I can do this check and show or…
-
6
votes1
answer312
viewsHow to organize the use of the z-index attribute?
One thing I’ve always found in CSS to be the most disorganized thing is the use of z-index. Often some frameworks/libraries, or even some developers, place an exaggerated value on z-index, causing…
-
6
votes2
answers917
viewsHow to make an all-white PNG image with CSS only?
I have an image, which is the client’s logo, all colored. At times, I need this completely white logo, to apply on dark backgrounds. I don’t always want to have to use two Pngs and I wonder if you…
cssasked 4 years, 11 months ago Wallace Maxters 102,340 -
5
votes4
answers2572
viewsExpandable menu CSS transitions
Having an expandable menu like using the CSS transition to open/close at the same time the part that is open and the part that is closing? The problem does not arise if the menus are the same size…
-
5
votes2
answers6149
viewsHow to put two backgrounds on the same page?
I am creating an HTML page with CSS, and would like to know how to put two backgrounds in the same HTML page via CSS. I have this image: I want to put this image on top, only it’s not high enough to…
cssasked 10 years, 10 months ago Marco Antonio 95 -
5
votes2
answers399
viewsHow to show value of an attribute in content: of a pseudo-element?
I want to show the value of an attribute as text. <div title="12:56pm"> <span data-measureme="1"> <span>hi</span> </span> </div> Example that doesn’t work in…
-
5
votes3
answers63205
viewsImage with 100% width
I have the following CSS statements applied to an element: .minhaClass { float:left; width:100%; height:560px; background:url(../imagens/corpo/imagen.jpg) repeat-x top center; } This will happen on…
-
5
votes3
answers2323
viewsHow to know if you are resize in width or height?
Is there any way to see if the resize() window is occurring in width or is occurring in height?
-
5
votes2
answers2143
viewsTake measurements of an element and play in variables? How to do?
Is there any way (using Sass maybe) to get the measurements (width and/or height) of already defined elements and store them in variables to use in calculations of other elements?…
-
5
votes3
answers54
viewsRemove margin with jquery
On a given page, when opening, I need to remove the margin class content to stay as I intend. CSS: .three-columns .content { margin: 20px 250px 0 250px; } .content { margin: 20px 0 0 250px; } I’m…
-
5
votes2
answers24059
viewsView div in Hover
How to display a div, which will have a summary about the movie (text), and a button to (SEE MORE) while hovering the mouse over an image. Example: <a href="#">IMAGEM</a> When hovering…
-
5
votes5
answers213
viewsCSS Child selectors on IE8?
Today I needed to fix to IE8 in which I used the following selector to align 3 boxes horizontally. #page-content .section-servicos .box-servico:nth-child(3n+2){ margin-right:0px; } in IE8 this code…