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
-
1
votes1
answer39
viewsHow do I let my inputs centralize radio?
I wanted to leave all items within the "Class;" centered straight and justified, with 3 items on the same line. https://jsfiddle.net/kaumikaze/pru0agw5/9/ input { width: 4.5rem; } .div-status {…
-
1
votes1
answer33
views -
1
votes1
answer30
viewsTransition not running at the same time on different elements
Guys, I have a problem in the transition CSS3, I have an icon in Font Awesome and link text that changes from white to light green on :hover, but when taking out the mouse the color changes one in…
-
1
votes1
answer70
viewsHow do I use @font-face for gmail signatures?
I tried to use <style type="text/css"> @font-face { font-family: 'Myriad Pro Semibold'; font-style: normal; font-weight: normal; src: local('Myriad Pro Semibold'),…
-
1
votes2
answers117
viewsHave side-by-side elements
Good morning, everyone, I’m trying to align an image with a table, but I’m not getting it. Can someone help me to identify what’s missing? Follows code below: index.html <section…
-
1
votes1
answer228
viewsError: Syntax error, unrecognized Expression with "string"
I’m trying to use this script... but when I add the console returns me this error: Error: Syntax error, unrecognized Expression: "#listProducts . showcase-0 > ul li.line listing > .…
-
1
votes2
answers2217
viewsNavigation menu with flexbox
When I create a list li navigation nav, the elements align without spacing and remain next to each other with padding-right = 0. That list is nestled in a header who owns display:flex to organize…
-
1
votes1
answer1305
viewsRound edges table CSS3
Good morning guys, I’m trying to round the edges of a table I’m using, but I can’t change either by the css file or by the style tag inside the element itself. Would anyone know the problem with my…
-
1
votes1
answer93
viewsIndexing in google TAG H1
Good morning. As far as my knowledge goes google indexes the a H1 tag, as I do the text I want to index related to the site is in the middle of p but would like the tag <h1> follow the font…
-
1
votes1
answer38
viewsSlide images inside a larger PNG image
This is the static PNG image, in the background of it I wish I had a slide of images that were visible only inside the cell phone HTML: <div class="device-combo device-combo-macbook-iphonex mb-6…
-
1
votes1
answer118
viewsHow to make sliders created with bootstrap, get responsive in all screen sizes?
The banner of my site is running well on monitor up to 15 inches. From resolutions above these banners get very large and generate horizontal bar on the site. As in the image below:…
-
1
votes2
answers119
viewsButton background does not change when it is first clicked. (Html5, pure CSS and JS)
Well, I have some buttons that represent bingo balls, and I want them to change color as soon as they are clicked, but they only change color from the second time they are clicked. I had to make a…
-
1
votes1
answer8559
viewsLike putting a div under one?
Gentlemen, I’m trying to insert a div under the other, the same should be according to the attached image, but when I execute it is not working. It follows an excerpt of my code, must be some detail…
-
1
votes2
answers68
viewsAlign images with CSS or bootstrap
I have several images that are as follows: Code on the front end: <div class="linha"> <div class="coluna"> <img src="~/Areas/ModuloPublico/Content/img/Home/Artesanato com cipó.jpg"…
-
1
votes1
answer35
viewsUL display failure at the time
I have a UL and its li’s has 50px of height. In this case the height of UL must obey these 50px Turns out in some li’s I have images in them and this is causing a augmentation in height of li. The…
-
1
votes2
answers3422
viewsCss effect when mouse clicking
I have a css effect on a div using the property Hover , I wonder if it is possible to activate this effect only when it is clicked . <div class="original"> <div class="spin"> <div…
-
1
votes2
answers34
viewsArrangement of grid boxes
I’m having difficulties to format the following grid, when I have several boxes, the format is correct. When only one box is added/shown, the grid picks up 100% of my father div, and I’d like it to…
-
1
votes1
answer31
viewsLeave fluid Ivs
I have the following structure <div id="container-header"> <div class="center"> <div class="content-header">content-header</div> <div…
-
1
votes1
answer185
viewsCol-Md-6 falling down instead of standing on the side
I need to make a section as in the image. That’s why I organized it this way. HTML <section class="second-section"> <div class="container"> <div class="row align-items-center…
-
1
votes1
answer41
viewsZig Zag Stripes with 3 or 4 colors - CSS3
Hello, I’m trying to make a zig-zag Stripe in css3 with 4 colors, would be gray, white, pink and white again. However I’m only able to do it with two colors. .zig { background:…
-
1
votes0
answers71
viewsHow to create a flexbox with flexitens that are images inside a hyperlink?
The idea is that I have a flexbox with two images that are links to other pages html. But when I create what becomes flexible are the hyperlinks and not the images. The code I’m using is this. body{…
-
1
votes1
answer234
viewsDoubt table header
I’m trying to get a tag th has two lines and the first line occupies the width the whole of the parent tag, and that the second row be divided into 4 columns. However I could not reach this result…
-
1
votes3
answers388
viewsChange DIV gradient background with Hover on buttons
I am studying HTML5 and CSS3 through an EAD course. I made a screen with social networking buttons with effect by hovering over (just training). The button goes up and below appears the name of the…
-
1
votes1
answer203
viewsHow to create an infinite slide similar to Instagram?
I’m trying to create an infinite slide similar to the one on the main instagram page, using only CSS3 and the BOOTSTRAP. I’m having the following difficulties: Create the right effect Images should…
-
1
votes1
answer386
viewsHow to style a checkbox input?
I’m creating multiple selections with the checkbox and need to leave it with the following characteristics: Transparent background Stylize the edges Remove the Check This so that it is on top of my…
-
1
votes1
answer92
viewsReduce UL padding during scroll
How do I make to reduce the padding of UL fixed of 40px for 20px after scrolling the screen on 10px only using CSS? I tried as below but nay worked: html, body { margin: 0; padding: 0;…
-
1
votes2
answers63
viewsChecked attribute does not respond with sr-only
I’m hiding the <input type="radio"> with class sr-only of bootstrap, and the problem that occurs is this: With class sr-only active: The radio are not unchecked if I click the other The .card…
-
1
votes1
answer59
viewsHow do I leave the background of a Hover color input in a table?
Is there any way to let an input that by default has its white background-color stick to the color of the line at the time of Hover? input { border: none; outline: none } <link rel="stylesheet"…
-
1
votes2
answers72
viewsHow can I define an element over another element?
Good morning, good afternoon, good evening. I’m having trouble using the transform: scale(1.7) in the div:hover, Every time I step the mouse, the div increases, but the one on the side is in front…
-
1
votes1
answer68
viewsHow to use localStorage in this case?
I was able to make a code that changes the color of my navbar with HTML and Javascript, but when the person updates the navbar color back to normal, how can I use localStorage to save this data,…
-
1
votes1
answer89
viewsSafari bug of a CSS animation with keyframes
In safari Version 12.1 (14607.1.40.1.4), a bug occurs, the effect happens, but gives a strange error, the element that suffered the event seems to recede, the initial position of the translate3d,…
-
1
votes1
answer79
viewsEffect with Hover in two elements
I am trying to make an effect that, when passing the mouse on some topic, the others decrease the opacity, highlighting the topic on which the mouse is. In addition, the Hover changes the color from…
-
1
votes0
answers50
viewsHow to put border-Radius in a span for the entire line even where there is break?
CSS: .mark-style { background-image: linear-gradient(to right, transparent 50%, rgb(183, 202, 88) 50%); background-size: 200% 90%; font-size: inherit; background-repeat: repeat-x;…
-
1
votes3
answers412
viewsCard misalignment in bootstrap 4’s smaller resolution size
Good friends. I have the following problem regarding the vertical alignment of my cards, below I leave the image and the code to better illustrate. Is there any way they can help me? To point out…
-
1
votes1
answer42
viewsColumns don’t line up inside Row
I’m trying to align a grid as follows: 3 columns x N rows <div class="row" style="margin-top: 150px;"> @forelse($models as $model) <div class="col-md-4" style="margin-left: 5px;">…
-
1
votes1
answer131
viewsProblem to generate integer numbers in Chartist.JS chart
I’m using a plugin called chartist.js it works well the problem is being the side numbers I’m putting from 1 to 5 the ideal would be like this 1 2 3 4 5 but it is generating so 1, 1.5, 2, 2.5, 3,…
-
1
votes1
answer157
viewsTranslatex() needs to be activated in a <li> and move a <Nav>
The problem I’m having is that I’m making a burger menu, this burger menu, once opened, has a specific field that when passing the mouse would have to open a sub menu, my idea is that this submenu…
-
1
votes1
answer206
viewsWhich property would be recommended for page content not to be "leaking"?
Image 1 Image 2 Which property would be recommended for the content of the page not to be "leaked"? Which I used in the code above was not successful. I am trying to keep this pattern of 3 squares…
-
1
votes1
answer165
viewsHow exactly does the grid area work?
I’m trying to style the page using grid in CSS but I don’t think I understand very well how the area template works. What are you doing: .pai { display: grid; grid-template-columns: repeat(3, 50px)…
-
1
votes0
answers56
viewsHow to prevent repeated values?
Hello, I am new still in development and I need to validate input fields, more precisely prevent the inputs of the same column within a table have repeated values. Html example <!DOCTYPE html>…
-
1
votes1
answer137
viewsImage is being cropped when the "max-width" CSS element is used
At the bottom of this Wordpress site there are various logo images. These images are entered by the site administrator himself within a table Pods, so I have no individual control for each image, I…
-
1
votes1
answer385
viewsHow to remove property inherited by the component?
When placing a side navigation icon, I noticed that a piece of it "leaked" out of the expected, which made it behave visually strange in the animation. I put a background-color: red for easy…
-
1
votes2
answers67
viewsSpacing in table
Good morning, everyone! All right? I have a little problem on my table I want to make a table in this model here I did it this way here, what’s the problem? When it’s in the mobile version, the…
-
1
votes2
answers56
viewsTitles together with image using flexbox
I’m creating a post area on my site (Html5 and css3), to make the layout of it I used flexbox, I was able to put the images all right, but I’m having problems to put the title of the posts below…
-
1
votes0
answers39
viewsStyle input[type=checkbox] containing only part of input id
I have a style in CSS like this: input[type="checkbox"] { box-shadow:none; background-color: #f5f5f5; } I wanted to put in a checkbox who has a id special: <input type='checkbox' id='check_" +…
-
1
votes1
answer185
viewsFlexbox - Image alignment
How do I leave the image in the print next to the text using Flexbox? follows the code. body { margin: 0; padding: 0; box-sizing: content-box; } header { display: flex; justify-content: center;…
-
1
votes1
answer36
viewsHow to interpret the properties Width, Height, Top, Left when using Transform?
I am using Firefox Developer 74 When I change the height of a div without using the property transform : rotate, I have a predictable behavior as in the images below. Only the height is changed.…
-
1
votes1
answer140
viewsCentering text in a responsive way
Good afternoon! I am building a project that currently has the following problem: The text Authentication is not getting totally centralized. I thought to use margin-right (this solution works only…
-
1
votes1
answer77
viewsHTML/CSS: When I click on the link it does not go to the right point of the page
I have a page that has a simple top menu that has some links that take the user straight to the section referring to this link: <style> nav { width: 100%; height: 60px; position: fixed; top:…
-
1
votes1
answer516
viewsRight alignment with Styled Components
I need to align the yellow content to the right of my menu bar as follows: But when trying, align, the content is glued to the menus: The layout of my elements and my CSS are as follows: return (…