Remove blue underline from link
You are not applying text-decoration: none; to an anchor (.boxhead a) but to a span element (.boxhead). Try this: .boxhead a { color: #FFFFFF; text-decoration: none; }
You are not applying text-decoration: none; to an anchor (.boxhead a) but to a span element (.boxhead). Try this: .boxhead a { color: #FFFFFF; text-decoration: none; }
This is a very good question. Everywhere I look, CSS files tend to get out of control after a while—especially, but not only, when working in a team. The following are the rules I myself am trying to adhere to (not that I always manage to.) Refactor early, refactor often. Frequently clean up CSS files, … Read more
OK, I’ve found it. This is probably the cleanest and easiest solution out there and does not rely on JavaScript being turned on. @-moz-document url-prefix() { h1 { color: red; } } <h1>This should be red in FF</h1> It’s based on yet another Mozilla specific CSS extension. There’s a whole list for these CSS extensions … Read more
If I read the specification correctly, no. You can match on an element, the name of an attribute in the element, and the value of a named attribute in an element. I don’t see anything for matching content within an element, though.
In the case of a non-fixed width div (i.e. you don’t know how much space the div will occupy). #wrapper { background-color: green; /* for visualization purposes */ text-align: center; } #yourdiv { background-color: red; /* for visualization purposes */ display: inline-block; } <div id=”wrapper”> <div id=”yourdiv”>Your text</div> </div> Keep in mind that the width … Read more
tl;dr – TWBSColor – Generate your own Bootstrap navbar Version notes: Online tool: Bootstrap 3.3.2+ / 4.0.0+ This answer: Bootstrap 3.0.x For Bootstrap 5.x, please check documentation Available navbars You’ve got two basic navbars: <!– A light one –> <nav class=”navbar navbar-default” role=”navigation”></nav> <!– A dark one –> <nav class=”navbar navbar-inverse” role=”navigation”></nav> Default color usage … Read more
Before you do that, keep in mind that the focus outline is an accessibility and usability feature; it clues the user into what element is currently focused, and a lot of users depend on it. You need to find some other means to make focus visible. In your case, try: input.middle:focus { outline-width: 0; } … Read more
Use align-items: stretch Similar to David Storey’s answer, my workaround is: .flex-2 { display: flex; align-items: stretch; } Note that height: 100% should be removed from the child component (see comments). Alternatively to align-items, you can use align-self just on the .flex-2-child item you want stretched.
You have to put them on one line like this: li:nth-child(2) { transform: rotate(15deg) translate(-20px,0px); } When you have multiple transform directives, only the last one will be applied. It’s like any other CSS rule. Keep in mind multiple transform one line directives are applied from right to left. This: transform: scale(1,1.5) rotate(90deg); and: transform: … Read more
Short answer: no. (It is now possible with CSS transform. See the edit below) Long answer: The problem with using “fixed” positioning is that it takes the element out of flow. thus it can’t be re-positioned relative to its parent because it’s as if it didn’t have one. If, however, the container is of a … Read more