Posts by hugocsl • 65,517 points
1,996 posts
-
2
votes2
answers278
viewsA: Change the size of a chart with JS
Another quick option if you want to decrease the chart as a whole, line width etc (except the text!) just use a transform:scale() in the canvas. The scale() works like this, the original value is…
-
1
votes1
answer30
views -
0
votes1
answer155
viewsA: Internal DIV overlaps external
Your problem is you’re using float:left in the child elements of container. When you put float in the Sons the Father loses the reference of the values of the box-model of these elements, for now…
-
1
votes1
answer366
viewsA: Styling Slides from a slide
Follows a model, and I’m warning CSS is to be used rss, because there is a way that can disagree with some things, as for example put the text content of ::after... So each span dot is a nth-child,…
-
5
votes1
answer166
viewsQ: Carousel content harms SEO? Is the hidden Carousel content indexed?
I have a question about Carrousel and how its content is indexed or not by crawlers search. First, I believe that most Carousels are not so friendly from the point of view of Accessibility. This…
-
2
votes2
answers3819
viewsA: How to create "Banner" with css?
I made a version using two linear-gradiente as background-image, so you don’t need to pseudos-elementos and saves some lines of code. If you want to do it with pseudo-elements I suggest you use…
-
2
votes2
answers111
viewsA: Reposition the side menu to floating when decreasing window
I made a version with jQuery, just to make a toogleClass. So when you click on btn I add a class to the sidemenu and it enters the screen. To make the effect darkened in the background I put a…
-
2
votes2
answers3404
viewsA: Tag hgroup is unusable?
As friend @Maujor commented, the tag <hgroup> is obsolete https://caniuse.com/#search=hgroup But as a complement I would like to leave a more semantic and updated solution using the tag…
-
0
votes1
answer129
viewsA: Make the tooltip visible without being in the Hover
To let the tooltipe arrow appear all the time you can roughly remove the pseudo-class :hover of the classes that have it as Anderson said, or you can refine the CSS by putting the styles that were…
-
1
votes1
answer1786
viewsQ: Why does my border-image not respect the border-Radius?
I’m wearing a linear-gradient as border-imagem in an element, but thus the edge does not respect the border-radius that I placed and does not realize the curvature in the vertices. I’d like it to…
-
7
votes1
answer98
viewsA: Mount CSS from Image
Here is an option. Study the background styles well body, that is nothing more than a radial-gradient, which goes from the brightest middle to the darkest end, giving this effect that you commented…
-
2
votes3
answers64
viewsA: Problem with animation in the Menu
Dude your code had some minor errors in both CSS and HTML. I’ll give you an explanation of your problem, and a way to solve it with CSS and HTML only In CSS the pseudo class :active is applied only…
-
5
votes2
answers257
viewsA: Behaviour of the pseudo-class :Nth-Child
The CSS rule has to be valid to be applied, meaning there have to be two things to be true, class and son. And see that the nth-child is for a group of fraternal elements, It doesn’t matter without…
-
2
votes2
answers226
viewsA: HTML5 Dynamic Drawer
I am putting this answer only as supplementary aid requested by the questioner in the comments of the question. Option 1 With label + input type radio Only with CSS you can use a CSS rule and…
-
1
votes1
answer31
viewsA: Horizontal scrollbar being rolled by vertical scrollbar
I believe your problem is that you didn’t set a certain height on html and body, I used height: 100vh; in this exepmplo, it may leave the bar in the expected place. ::-webkit-scrollbar {…
-
1
votes1
answer54
viewsA: Doubt vscode - ASP.NET
It is described in the official documentation: https://code.visualstudio.com/docs/setup/setup-overview#_how-do-i-create-and-run-a-new-project VS Code doesn’t include a Traditional File > New…
-
3
votes1
answer189
viewsQ: Why Button inside Label does not work. Button does not work as expected not to activate Checkbox
I was making a Menu that only appears when a checkbox is checked. And to change the state of that checkbox I need to click on label of it, since the input:checkbox is actually hidden. What happens…
-
1
votes1
answer149
viewsA: Help to view the Megamenu primefaces
Ayrton as stated in the comment is just a simple template to help you understand a html structure model that can solve your problem. It’s basically made with position:relative in aside and…
-
3
votes1
answer241
viewsA: infinite slide with css and html
Your mistake is just that you wrote this property wrong animation-interation-count: infinite; Is not interation should be iteration Thus: animation-iteration-count: infinite; Important: As you can…
-
1
votes1
answer493
viewsA: Turn card to Carousel when resolution decreases
Dude I tried to do by adding the classes Owl-Carousel and Owl-Theme by jQuery while the screen was less than 768px, but it didn’t quite work... So basically I had to replicate the content and use…
-
2
votes1
answer40
viewsA: Input spacing when fields are hidden
The suggestion I give you is to use the class in .row external that is with the hidden elements inside, and not direct in the elements that you want to hide understand. For example as I did with…
twitter-bootstrapanswered hugocsl 65,517 -
1
votes1
answer1164
viewsA: Dropdown containing image on the right
I’m tired of seeing this unanswered question... so here’s an option. The idea is to have in the dropdown two lists, one with the Menu, and the other with the image only, usandp display:flex in the…
-
1
votes1
answer169
viewsA: Leave images together and responsive
Cara follows an option, she uses the image as background-image of div and not with the tag <img>, but if it is essential to use the tag <img> tell me, because it is also possible to…
-
6
votes3
answers46967
viewsA: What is the difference between col-lg-* , col-Md-* and col-Sm-* in Bootstrap?
Now with the official version of Bootstrap being the versão 4, I believe the answer deserves an update. Follow the link to the official documentation of summer grid 4:…
-
1
votes1
answer90
viewsA: How to mark a specific Checkboxlist item with jquery
With jQuery you can check one checkbox thus .prop('checked', true), using the value attribute $('[value="teste"]') See example working. $("#btn").click(function() {…
-
2
votes1
answer281
viewsA: Position font-awesome next to text
Face on the icons of the Fontawesome the easiest way for you to adjust to my view is to create a UL/LI with the icon inside, ai vc can use the classes of Margin bootstrap mr-x and mt-x etc to adjust…
-
4
votes1
answer74
viewsQ: What is rel="noopener"? Should I use it on all links on my site? Can it affect SEO?
I recently noticed that the property rel of link may receive the tribute noopener, but I didn’t quite understand the advantages of using it... <a href="http://example.com" target="_blank"…
-
2
votes1
answer37
viewsA: Hover with mix-blend-multipy
Face your problem is actually here. Notice this snippet of your code that you are animating property that do not exist before the hover. With this the browser does not know right how to proceed.…
-
4
votes2
answers957
viewsA: Cards with smaller content breaking
Cara already exists natively in Bootstrap 4 a way to "align" the height of cards, and is with a Card Group as you can see here: https://getbootstrap.com/docs/4.0/components/card/#card-groups Then…
-
1
votes1
answer507
viewsA: Navbar disappearing at lower resolution
First your Navbar BTN is there, it just doesn’t appear because you didn’t use a color class in Navbar type navbar-light, or navbar-light. In the example I put navbar-dark pro btn go white. About the…
-
2
votes1
answer786
viewsA: Show a Collapse and hide the other BOOTSTRAP 4
Dude I made an adaptation with the Accordion and it was very good in my view :D, because it has the functioning that you want to open One and close the Others. This way you will always have only one…
-
14
votes2
answers1129
viewsQ: What is the purpose and how to use the "display: Contents" of the CSS?
I recently saw that there is a new kind of display in the CSS the display: contents, but I didn’t quite understand the intention of using it? https://developer.mozilla.org/en-US/docs/Web/CSS/display…
-
5
votes2
answers232
viewsA: Abaloada shape with CSS how to do? How to make a Shape in this kind of aredondado format?
Option 1 With only a div and its pseudo-elements ::after and ::before it is possible to get a result very faithful to the reference image. The idea is to have a div main as container. Then in the…
-
1
votes1
answer60
viewsA: Dropdown does not work with responsiveness (Bootstrap)
Boy this indexing order and the shape with makes is really confused. A tip I give you is to separate the .CSS in the <head> and everything .JS you put there at the end as the last thing before…
-
3
votes1
answer60
viewsA: Adjust the middle slide according to the proposed layout
Dude I made an adaptation with transform and transition, until it turned out pretty cool, you might have to adjust a padding or margin to adjust it in its final layout. Follow the code referring to…
-
4
votes4
answers844
viewsA: How to Make Material Design Style Button Only with CSS
Tweaking CSS can make a template closer than I wanted. It activates the animation in the click, not when I release the mouse button. The main point is the pseudo class :active, along with a…
-
7
votes2
answers232
viewsQ: Abaloada shape with CSS how to do? How to make a Shape in this kind of aredondado format?
I would like to make an element half round, it is not an ellipse, nor a circle, nor an element with border-radius. It’s a kind of rounded shape as you can see in the image below and I couldn’t do it…
-
3
votes1
answer3505
viewsA: How to make a header with background image
Follow an example, I know that some properties are repeated and could be optimized, but prefer to leave individually to facilitate your understanding, even with a few extra lines of code. I…
-
3
votes1
answer237
viewsA: Media Queries Does Not Work Informed Measures
Guy like you is working with min-width and not with max-width your rules @media should start from lower value to higher value. But you did the opposite... This image will help you understand How you…
-
1
votes1
answer57
viewsA: Different image and responsive text alignments
Your Grid guy had serious construction mistakes. I’ll give you a hint STUDY THE GRID Bootstrap is very easy to understand and won’t take you more than an hour! Understanding Grid will solve 90% of…
-
3
votes2
answers3823
viewsA: Responsive menu using Bootstrap
The thing is, you stopped using the original Bootstrap color classes, like navbar-light or navbar-dark, as well as the bg-light or bg-dark etc, so its button does not appear as it only applies the…
-
5
votes4
answers844
viewsQ: How to Make Material Design Style Button Only with CSS
On Android and on design system Material Design is common to see this button they call Ripple Buttom. https://material-components.github.io/material-components-web-catalog/#/Component/ripple But it…
-
0
votes1
answer246
viewsA: Inserting javascript in joomla header 2.5.8
I believe that the Administrator area may be even easier to solve this. But it may depend a little on your theme... In this example with this theme had the tag <head> in the .php ai…
-
1
votes2
answers2085
viewsA: Line break inside a table cell
It has a word-wrap and a white-space in its code, being that the white-space nowrap that comes after does not let the text break, with that its text does not break it is the text-overflow
-
0
votes1
answer63
viewsA: I need to make a shape with css and I can’t. And rotation doesn’t work on IE11
EDIT: I preferred to reformulate the answer completely after analyzing the direct code in the link quoted in the question Looking at the code, I noticed some errors. First your @keyframes was a…
-
3
votes1
answer300
viewsA: Navbar Bootstrap
Your problem is that you are using the Bootstrap 4 menu structure, but you are indexing the CSS and JS files of Bootstrap 3. You have to pay attention to which version you are using and which…
-
1
votes1
answer28
views -
1
votes1
answer37
views -
2
votes1
answer45
viewsA: How I fix css or code from my website logo so it always keeps the original size of width and height
Your problem may be pq vc has a class with a higher hierarchy defining the maximum height as 30px. Another point is that: The properties min-height and max-height overlap with height. As you can…
-
1
votes1
answer28
viewsA: <video> does not respect preset height and Object-fit:cover in Google Chrome
What happens is that your video is extrapolating the measure of container. One way to solve this is by putting overflow:hidden in the container Image made in Chrome! (Vr. 71) Image code above: div {…