Most voted "css3" questions
The term CSS3 is used to refer to CSS properties and selectors added after level 2.1 of the specification. Use this tag for questions about new CSS modules.
Learn more…1,944 questions
Sort by count of
-
3
votes2
answers90
viewsHelp with @keyframe effect
Not to cause confusion in the topic Div’s coming and going, I decided to create another because the problem has now changed. I have the html: * { margin: 0 auto; padding: 0; } body { width: 900px; }…
css3asked 8 years, 8 months ago Carlos Rocha 1 -
3
votes1
answer143
viewsFlexbox replaces the GRID?
I’ve been taking a look at the flex properties, and I realized that they do the same thing as the grid or am I wrong? If so, what difference does it make? When I should wear one or the other ?…
-
3
votes1
answer208
viewsCSS selector changing value if it contains an element
By choosing any selector definition it is possible to set styles for each element that this is defined. My doubt would be, instead of selecting an element and changing properties for itself, I would…
-
3
votes1
answer78
viewsHow to make the elements appear with the mouse scrool?
Visibility.onVisible(function(){ setTimeout(function(){ $(".animar").addClass("animated fadeInDown"); }, 400); setTimeout(function(){ $(".animar2").addClass("animated fadeInDown"); }, 800);…
-
3
votes3
answers3645
views -
3
votes2
answers112
viewswindow.innerWidth does not work on Windows Phone
I got a problem: On the page http://www.magicforbaby.com.br/, has a banner where I can’t set its size (from div). But as it takes all 100% of the screen, I took window.innerWidth from the browser…
-
3
votes1
answer7662
viewsHow to break the line by passing the size of the div?
I have this problem rendering text without spacing. How can I fix it?…
-
3
votes2
answers1635
viewsz-index does not work on link
I’m having a problem creating a <div> masking and a link to disable this mask. In another layout that I had worked normally, now that I am performing the exchange it stopped working. I have…
-
3
votes3
answers112
viewsHow can I specify a "Transition" value to be animated when using "Transform"?
IN THE css, we can use the property transition to define a transition effect when some of the properties of an element are changed. Example: .box{ transition: all 1s linear; background-color:…
-
3
votes2
answers83
views@media screen not working properly
I’m studying css and html still, so I may be making some banal mistake, I’m not able to solve alone. The problem is the following I set on @media screen a minimum width for it to change the img…
-
3
votes1
answer183
viewsBox shadow appearing from right to left
I have the following code http://codepen.io/leoamrl/pen/xErdQL which so far is exactly how I want it. Except because I want the Hover effect to appear from right to left. How could I do it with box…
-
3
votes1
answer261
viewsHow to position button and . page-header in the same Row (inline)
I am using the bootstrap for a simple and helpful panel of you regarding the positioning of certain elements on the page. I would like to position the save button along with the .page-header. But…
-
3
votes2
answers2477
viewsCSS-only carousel: problems centering and fixing size
I have a carousel created with only CSS, but I have identified some difficulties. All images are in the 4:3 ratio and may have until 640x480 px (i.e., may be less than this value), so: I cannot…
-
3
votes1
answer1061
viewsinput:checked is not applying the properties
I’m developing a responsive menu using css3 (I can’t use JS), and I’m having a problem that’s keeping me from moving forward, the problem is the following : input:checked ~ nav { display: none; }…
-
3
votes2
answers790
viewsAdd border over an image and text
How do I override a border on an image and text, leaving a border for the image as the attached image:…
-
3
votes3
answers38304
viewsPosition DIV in the center of the page
How do I align the div with black and transparent background where it contains the buttons in the center of the page independent of the monitor resolution? The code I’m using is this: .fundo{…
-
3
votes1
answer70
viewsIs it safe to use grouped media queries?
All topics I found regarding media queries grouped are a few years. With the wide range of CSS3, grouped media queries are now considered safe to use in production? Do any browsers that support CSS3…
-
3
votes2
answers964
viewsLeave image with the <img> proportional tag in relation to div
I want to leave the proportional image inside the div, but I’m not getting it. The only "solution" I have found so far is to put Object-fit: cover, but this style is not compatible with many…
-
3
votes1
answer1416
viewsPin menu to top of page when scrolling down
I have a div with height 100% and after it a navbar. I would like that when you scroll down the page the navbar fixed at the top of the page. CSS ul.navbar { list-style-type: none; margin: 0;…
-
3
votes3
answers3242
viewsLoad HTML from another HTML
I would ask for help in loading inside my main HTML file external files from 2 other HTML pages Below follows the Nav <!DOCTYPE html> <html lang="pt-br"> <head> <meta…
-
3
votes1
answer1140
viewsCentralize loading on the page
I’m riding a load and I’m having 2 problems. How to leave the div circle that contains the animation in the vertical and horizontal center of the screen. 2º How to leave the tips of the load…
-
3
votes4
answers1314
viewsPosition div below other after browser decrease
My question is how to position the black div below the red when the browser is resized? .teste2 { float:right; width: 200px; height: 100px; margin-top: -100px; background-color:black; } #teste {…
-
3
votes2
answers735
viewsIs there a css selector that selects elements through your text?
I want to add background the row of a table in which one of the columns is: Value 1. I tried with the pseudo-class contains and by innerHTML, but all without success. Code: table tr td…
-
3
votes1
answer50
viewsHow can I use pseudo css elements
Following a css3 tutorial, I learned how to place icone inside inputs. The dev I was teaching used an example of 2 inputs to put 2 icons 1 in each input. In this case it used the following pseudo…
-
3
votes1
answer1274
viewsCSS formatting for PDF generation
I am using a loop to generate a PDF file. Each loop iteration should generate a PDF page. The problem is that a blank page is always coming out at the end of the generated PDF. I know this page is…
-
3
votes2
answers360
viewsWhy doesn’t my . svg work in Firefox?
My . svg is not loaded in Firefox, in Chrome it works normal. I am using css to do this, with the property background: url('data:image/svg+xml...). I made a Jsfiddle for example, containing all the…
-
3
votes1
answer65
viewsWhat are CSS Feature Queries? How do you use them and what are they for?
I’ve been hearing the term a lot Feature Queries when referring to CSS3. But what are they and what are they for Feature Queries? How this applies in the CSS of projects?…
-
3
votes2
answers1320
viewsLimit characters and display the amount of characters
Good guys I got one input for the user to put the name, and below the input I have both typed characters and the maximum amount (0/50). I wish that every time he typed himself increases the typed…
-
3
votes1
answer1456
viewsSection with two colors
I’m having a hard time doing a two-color Section (one occupying 70% of the Section and the other the remaining 30%), I wonder how I can do this follow the example: suggestions?…
-
3
votes2
answers1224
views -
3
votes1
answer2520
viewscss - Always define standard Rule 'keyframe' when Defining keyframe Error
I’m getting error in the code below that says css - Always define standard Rule 'keyframe' when Defining keyframe Error It runs normally on Chrome but is not working on IE 11 @-webkit-keyframes…
-
3
votes1
answer250
viewsHow to underline effect by controlling the underscore size
How to make a title have an underscore, but manage to control the size of that underscore. Follow an example of the intended:…
-
3
votes1
answer390
viewsDelete table row by checkbox
I am trying to use a checkbox to delete several rows from a table created by Avascript with input information. However I do not know how to make it recognize the td to can perform the delete…
-
3
votes0
answers176
viewsReverse slide transition, VUE JS
I’m developing a single page Aplication/app mobile, with VUE JS, I want to slide when switching pages, and I can already do it this way: transition name="slide" router-view transition But I wanted…
-
3
votes1
answer712
viewsFade effect with CSS3
I am trying to cause an effect (unsuccessfully) to fade the image using the following code: @-webkit-keyframes fundo { 10%{ -webkit-filter: grayscale(10%); -moz-filter: grayscale(10%); -ms-filter:…
-
3
votes1
answer34
viewsClear body keeping only 2 elements
I need to delete everything from body, except for 2 items. I tried the ways below but none worked: body > *:not("div#pedidosRelMensal, h1.resposta"){ display: none; } body >…
-
3
votes4
answers2171
viewsCSS, Bootstrap4 Cards Side by Side
good morning! All right? I am having difficulties with bootstrap 4, when using cards I would like them to line up side by side, but they are below each other and I do not know how to leave them side…
-
3
votes1
answer206
viewsReverse CSS3 transition effect
I wonder how I can reverse the transition effect of elements with CSS3 $('span').on('click', function(){ if($(this).text() == 'Mostrar Efeito') { $('div').css('max-height', '250px');…
-
3
votes1
answer229
viewsBlack screen in youtube EMBED loop
I put a background video on the login screen of my page but when the video comes to an end it stays with the black screen for 3 seconds until restarting the video as I do for it to do it instantly ?…
-
3
votes3
answers306
viewsHow to remove internal dashes from a <SELECT> in Firefox
Once again I just realized that Firefox is putting "additional stylings" in my inputs. This time, in the <select>, when I click on it to select an option, there is always an internal dashed:…
-
3
votes2
answers67
viewsIncorrect centering of button
I have a button within a div which I cannot center on. By means of margin-left I can do this, but to treat the same in the responsiveness is very massante. Code of button together with the div:…
-
3
votes3
answers307
viewsButton and span logic from CSS
I have a button and a span from the following code: <div id="onestepcheckout-place-order"> <button type="button" class="button btn-proceed-checkout btn-checkout" title="<?php echo…
-
3
votes2
answers289
viewsbox-shadow:inset property does not work in <img>
I was testing the property box-shadow to make a gallery and realized that the tag <img> does not accept the box-shadow:inset... but accepts the box-shadow normal. However if I put the…
-
3
votes1
answer277
viewsSelect Checkbox and maintain CSS styling
Dear ones, I have stylized my checkbox, but I would like to be able to select more than one option while maintaining the style of CSS which I created.Only due to my CSS rule, this is selecting only…
-
3
votes2
answers507
viewsHow to make a div Scale without changing the child elements?
How do I make the content opacity and size within paragraphs not change when the transition occurs?! #quadrados{ padding-top: 2vw; overflow: hidden; width: 100%; height: 30.5vw;…
-
3
votes1
answer390
viewsDIV exiting the screen
I’ve seen several times a div kind of coming off the screen, and as I won’t be able to explain it properly, I’ll show you a picture of an example: I figured it would be box-shadow, but I couldn’t do…
-
3
votes1
answer168
viewsIcon inside HTML data-text attribute
The doubt may be silly but I really don’t know how to do it. It is possible to escape an awesomefonts icon (already installed in the project) inside an HTML attribute, in this case the data-text?…
-
3
votes1
answer565
viewsHow to not let a CSS Animation stop even after the mouse has left the element
I have a div who has an animation in :hover, but if the user takes the mouse away from the div before the animation ends she cuts in half and does not finish. I tried to make a "spot light" effect…
-
3
votes1
answer1072
viewsTransparenet beveled edge with css only
There is a simple way to make a beveled edge with CSS only, but transparent. No need for svg, png, etc? Look what I’ve done so far: https://jsfiddle.net/Cafardo/zn5oysqy/5/ .home_fundo{ width:…
-
3
votes2
answers129
viewsMinimal Hover Menu - The Right Way
In the example below we have an interesting menu, with a effect Hover, which follows the mouse and its items. Everything is very beautiful and works well. The problem is that this menu is set with…