Just append :after to your #alertlist li:hover selector the same way you do with your #alertlist li.selected selector: #alertlist li.selected:after, #alertlist li:hover:after { position:absolute; top: 0; right:-10px; bottom:0; border-top: 10px solid transparent; border-bottom: 10px solid transparent; border-left: 10px solid #303030; content: “”; }
Is it possible to select an element if it contains a specific child element? Unfortunately not yet. The CSS2 and CSS3 selector specifications do not allow for any sort of parent selection. A Note About Specification Changes This is a disclaimer about the accuracy of this post from this point onward. Parent selectors in CSS … Read more
It’s an attribute wildcard selector. In the sample you’ve given, it looks for any child element under .show-grid that has a class that CONTAINS span. So would select the <strong> element in this example: <div class=”show-grid”> <strong class=”span6″>Blah blah</strong> </div> You can also do searches for ‘begins with…’ div[class^=”something”] { } which would work on … Read more
In CSS3 you could use height: calc(100% – 60px);
You need to set left: 0 and right: 0. This specifies how far to offset the margin edges from the sides of the window. Like ‘top’, but specifies how far a box’s right margin edge is offset to the [left/right] of the [right/left] edge of the box’s containing block. Source: http://www.w3.org/TR/CSS2/visuren.html#position-props Note: The element must … Read more
You have to set the height of the .modal-body in and give it overflow-y: auto. Also reset .modal-dialog overflow value to initial. See the working sample: http://www.bootply.com/T0yF2ZNTUd .modal{ display: block !important; /* I added this to see the modal, you don’t need this */ } /* Important part */ .modal-dialog{ overflow-y: initial !important } .modal-body{ … Read more
100% can be 100% of the height of anything. For example, if I have a parent div that’s 1000px tall, and a child div that is at 100% height, then that child div could theoretically be much taller than the height of the viewport, or much smaller than the height of the viewport, even though … Read more
Here is the solution I finally came up with when using a div as a container for a dynamic background. Remove the z-index for non-background uses. Remove left or right for a full height column. Remove top or bottom for a full width row. EDIT 1: CSS below has been edited because it did not … Read more
For CSS that are reused among the entire site I define them in the <head> section of the _Layout: <head> <link href=”https://stackoverflow.com/questions/5021552/@Url.Content(“~/Styles/main.css”)” rel=”stylesheet” type=”text/css” /> @RenderSection(“Styles”, false) </head> and if I need some view specific styles I define the Styles section in each view: @section Styles { <link href=”https://stackoverflow.com/questions/5021552/@Url.Content(“~/Styles/view_specific_style.css”)” rel=”stylesheet” type=”text/css” /> } Edit: It’s … Read more
flex: 1 means the following: flex-grow : 1; ➜ The div will grow in same proportion as the window-size flex-shrink : 1; ➜ The div will shrink in same proportion as the window-size flex-basis : 0; ➜ The div does not have a starting value as such and will take up screen as per the … Read more