Posts by hugocsl • 65,517 points
1,996 posts
-
5
votes1
answer154
viewsA: How to improve my HTML layout?
For this particular case, as I mentioned in the comment, I would point out to you the flexbox and not the grid, as you can see in this question the Grid will not give you the possibility to align…
-
2
votes1
answer221
viewsA: Put Outline into HTML5 USEMAP
Monday the W3C: The area element represents either a hyperlink with some text and a corresponding area on an image map, or a Dead area on an image map. Translating "The element of area represents a…
-
0
votes2
answers166
viewsA: Centralize CSS/HTML menu
Use display:flex and Justify-content: center in parent container. #cssmenu { Display:flex; justify-content:center; font-family: 'Lato', sans-serif; width: auto; -webkit-border-radius: 3px;…
-
1
votes2
answers1781
viewsA: Keep image dimension inside div with flexbox
Actually what happens is that by default every son of a father with display:flex tends to expand to occupy the entire height of the father should the flex-direction if row, or take up the whole…
-
1
votes2
answers1067
viewsA: Bootstrap 4 Tooltip does not work properly at Angular 6
Dude got some details there. First you have to start the script Tooltipe, I don’t know if you’re doing this. Here’s the official documentation: https://getbootstrap.com/docs/4.0/components/tooltips/…
-
4
votes2
answers873
viewsQ: How to Make 3D Text with CSS
Is there any way to get to this result with CSS only? Make a kind of 3D effect in text panes with CSS? Type the image below? body { background-color: #880000; } h1 { color: #fff; font-size: 100px;…
-
2
votes4
answers2615
viewsA: Drawing with CSS
You can try to "wear" the div using absurd values for each of the vertices with border-radius The inner part of the vc sheet can do using repeating-radial-gradient with ellipse and a box-shadow…
-
1
votes4
answers1366
viewsA: Creating elements with jQuery
One of the options is using the tag <template> of HTML https://developer.mozilla.org/en-US/docs/Web/HTML/Element/template The HTML element <template> is a mechanism to encapsulate a…
-
13
votes3
answers10654
viewsA: How to make a progress bar ranging from 0 to 100% with CSS only?
Has a different way of doing using linear-gradiente, so no more than a tag or use pseudo-element. Imagine you have one linear gradient as background of a container, and that this gradient is divided…
-
1
votes2
answers908
viewsA: bootstrap icons
Dude basically you are using the Glyphicon classes that were the standard icon library of Bootstrap 3, inside Bootstrap 4, but by indexing the CSS of Fontawesome 5 and making a @inport of Fontawesom…
-
2
votes1
answer61
viewsA: Show all span content regardless of size
If you want the line to break you need to remove some things from your CSS like the white-space: nowrap; and overflow: hidden; Then you add the property word-break: break-all; to break the word,…
-
1
votes1
answer159
viewsA: Referencing elements with CSS to reposition them
On the table you can make it occupy 100% of the width of the container where she is inside, after that you determine that she will divide the two columns with 50% for each one. About the GOOD, there…
-
1
votes1
answer388
viewsA: Can VS Code have a Color Theme for each Language?
I still don’t consider the perfect option. But I got a extension of the VS Code that does this! https://marketplace.visualstudio.com/items?itemName=jsaulou.theme-by-language It works like this,…
-
0
votes2
answers49
viewsA: Change table name with :Nth-of-type
I believe you have the wrong view of how the content in the ::after, It will not replace the text that is inside the tag, it will add the content of content: "" within the tag. So to work the way…
-
0
votes1
answer38
viewsA: Bootstrap grid mess
Friend, from what I understand of your answer it seems that’s what you need. But in your project there must be something else that is breaking the original Bootstrap grid, even with a col inside the…
-
4
votes1
answer627
viewsQ: How to adjust Background to fit inside container without cutting anything?
I have a Pattern that is repeated in both X and Y that I want to use as background in a div, but I’d like it to fit within the div without cutting on the sides as in the image. (I want them to have…
-
2
votes2
answers60
viewsA: problem leaving a text on the left and 2 items on the right
I would advise you to use the separate elements within the Grid... Of that were, a col to the H3 and a col for the Btns .col-item { border: 1px solid #E1E1E1; border-radius: 5px; background: #000; }…
-
4
votes2
answers15167
viewsA: Element superimposing the other CSS
According to the documentation of framework that you’re using https://mdbootstrap.com/ when you put position:fixed or position:sticky in NavBar you need to put a padding-top in the body Fixed…
-
1
votes1
answer51
viewsA: Styling an element that is not a child of the element used in the selector
Your thinking is right! When you put the selector ~ in a input:checkbox that is inside the one container, regardless of the state of that checkbox (checked or not) you cannot reach an element that…
-
1
votes1
answer107
viewsA: problem with a grid bootstrap
To remove this line that makes the separate one just you remove the class that class of the element. I only left in the last element so you can visualize with and without the edge .col-item .btn-add…
-
5
votes4
answers3500
viewsA: How to increase the space between text and underline in CSS?
It is possible to change the distance between text and underline? Yes as colleagues have already demonstrated you can increase the distance between what would be a underline and the text. I’ll just…
-
7
votes2
answers672
viewsQ: How to make a reflected text with CSS ? (like a mirrored text)
I would like to make a reflected text effect or mirrored text effect with CSS only Like this picture: Does anyone have any hints, or knows if it is possible to make this effect mirrored only with…
-
1
votes1
answer135
viewsA: Problem with grid bootstrap
Dude you’re using the class name the wrong way, it’s not .col-4, you shouldn’t wear that . is just col-4 Another problem is that you’re using mr-4, This too is helping your grid to break... replace…
-
1
votes1
answer43
viewsA: problem with a container leaves in horizontal
To work properly you have to use the Bootstrap Grid... It is not enough that you put the content on the page without determining a "position" for that content within the Grid. Here you can see the…
-
0
votes2
answers174
viewsA: About tag meta name="Author" content="">
I’d tell you to use the meta tag copyright if you want to declare who is the copyright owner of the template. <meta name="copyright" content="© 2018 Wesley Vicente" /> You can also use the…
-
7
votes2
answers4346
viewsA: How to center and position side by side two images? html css
You can use for example display:flex for that reason. See how it looks in the example, I left the comments in the code. #ladoalado{ display: flex; /* coloca as imagens uma ao lado da outra */…
-
1
votes1
answer122
viewsA: The target of CSS selectors with pseudo-element ::before
Fernandes if I understand you well you want to know why he used the content correct? Let’s explain. A CSS pseudo-element is a keyword added to a selector that allows you to style a specific part of…
-
1
votes1
answer238
viewsA: Align Bootstrap paging on the right
Apparently it seems that you are using a simpler version of Bootstrap that must have left out some classes of Utilities as the classes of Flex. https://getbootstrap.com/docs/4.1/utilities/flex/ Or…
-
0
votes1
answer287
viewsA: how to horizontal all items of a div
In the div class="containerprodutosfilha puts display:flex .containerprodutosfilha { display:flex } <div id="containerprodutos" class="containerprodutos"> <div id="containerprodutosfilha"…
-
4
votes3
answers320
viewsA: On fixed footer position only at the bottom of the page
This option has a slightly different HTML structure than yours. And background is actually in main, made with a linear-gradiente to "split" the layout into two columns. If the contents of main does…
-
2
votes2
answers42
viewsA: Problem with jQuery in display
Since you are already using jQuery you can use .next() and .prev() to greatly reduce this code. I am only indicating this method due to the structure you have mounted the images in HTML, one after…
-
2
votes1
answer2564
viewsA: Justify-content-center is not centering content on my bootstrap
In fact the classes are working yes, as you can see in the image. Now fixing the code But only to do what you want you need to put the classes in col-* and not in the .row. Besides, your div class…
-
1
votes1
answer189
viewsA: CSS image gallery
Look to do what you want like the image below you will have to make some adaptations in CSS, it’s little thing! But they make all the difference. No need to touch the HTML and the structure or order…
-
2
votes1
answer27
viewsA: How to specify the search engines to update an HTML document?
You can build your sitemap.xml using the tag <changefreq></changefreq> to tell the crawlers that you want your content to be reindexed, every hour, every day, or weekly for example. Here…
-
1
votes2
answers6101
viewsA: How to border images using Html5+css?
Look had two syntax errors in your code. First the tag for image is <img> and not <image> and its tag <figure> was spelled wrong... figuTe Other than that if you want the border…
-
1
votes2
answers1048
viewsA: Changing Width of a Modal
To work you have to put the custom CSS style inside the breacking point! If you are interested here you have a reference in the official documentation, however the default size of modal-lg is 800px…
-
7
votes2
answers598
viewsA: Counter properties in CSS. What are they for and how do they work?
There are some very interesting forms of application for counter. One is to number pages, the other is to number items and sub-items from a list for example. But you can use to number chapters of an…
-
7
votes1
answer399
viewsQ: How do you make Scroll center on the elements inside the container?
Imagine that I have an image gallery that is inside a container. But each image in the gallery has a size according to the image: What I’d like to do is a snap, so that at the time of scroll at a…
-
5
votes2
answers310
viewsA: Float vs. inline-block. What are the advantages and disadvantages of each?
Float serves for vc to "float" elements side by side. A div is a block element and functions as a box model, that is it takes up 100% of the screen width and accepts values from margin, padding and…
-
2
votes1
answer739
viewsA: Bootstrap Responsive Navbar is not working!
Your problem is that you put a reference to data-target="#navbarNav" other than ID that you used on the <div class="collapse navbar-collapse" id="navbarSupportedContent"> Note that by placing…
-
0
votes1
answer55
viewsA: Centralize a NAV - With video background
Face your problem is that you set the display on NAV as display:inline should be diplay:flex so you can use the properties justify-content: center and align-items: center. Also you have to declare…
-
6
votes1
answer292
viewsA: What’s the use of padding Bootstrap’s container?
See that: (whether it is Bootstrap 3 or Bootstrap 4) Container: The container works that way so the container edges can have that padding 15px virtual around the content, but not requiring the tag…
-
5
votes1
answer349
viewsA: What is Reduced Motion Media Query?
*First I need to make some clarifications about the Animation Reduction Preferences. * Apparently when Apple made a upness from iOS to version 7 in 2013 she had a negative feedback from several…
-
3
votes1
answer4844
viewsA: Vertical Alignment Bootstrap
The Bootstrap 4 grid is in flex, then the Utilities that you have to use are those of the klex, here is the official documentation: https://getbootstrap.com/docs/4.1/utilities/flex/ Just put the…
-
2
votes2
answers375
views -
2
votes2
answers413
viewsA: what other tag can be used to replace hgoup?
Different from the answer cited as duplicate, in which it only proves that <hgroup> was discontinued. Tag hgroup is unused? Currently, according to the Mozilla documentation you can use the…
-
2
votes1
answer388
viewsQ: Can VS Code have a Color Theme for each Language?
My question is this. I would like to have a theme of simpler colors and with less colors to work with CSS, already for HTML I would like to have a theme with more accentuated and marked colors. For…
-
1
votes1
answer102
viewsA: SVG - Problem opening svg file
Your SVG guy had some weird stuff. Although you could use a tag <svg> inside another I thought it best to use a tag <g>, another thing was that you were putting a transform:translate in…
-
5
votes1
answer729
viewsA: When should an ordered list actually be an ordered list in HTML?
UL vs OL UL UL is a set of elements where the order does not matter to the understanding of the content, ie, regardless of the ordering of these elements the user will always be able to understand…
-
2
votes2
answers159
viewsA: How to build header with logo in the center and information on the left and right
The structure you have set up for HTML in your top bar has some organizational errors. For example you should not use a container into each other, and the way you’ve divided the rows and cols didn’t…