You can’t use @font-face in Firefox with a font hosted on a different domain If you want to specify a font for @font-face using an absolute URL, or a font hosted on a different domain, it needs to be served with Access Control Headers, specifically the Access-Control-Allow-Origin header set to ‘*’ or the domains allowed … Read more
This is how Flexbox rows are expected to behave. Flexbox is not meant to recreate Masonry with pure CSS: items in one row cannot occupy space allocated for a preceding/following row (same goes for columns if you’re using column orientation). You can use align-items to prevent them from stretching, but that’s about it: http://cssdeck.com/labs/9s9rhrhl #container … Read more
add this styles animation-iteration-count: infinite;
Based on your error message (error sass/test.sass) I can tell you’re using the .sass extension for a Scss file. Change your file name to style.scss. Sass and Scss use two different and incompatible syntaxes.
Update: LESS >= 1.6 As of version 1.6 (see changelog) property name interpolation is implemented in LESS. So you don’t need any magic anymore. (For older versions, see my original answer.) Your mixin would work basically as is: LESS: .vendor(@property; @value){ -webkit-@{property}: @value; -moz-@{property}: @value; -ms-@{property}: @value; -o-@{property}: @value; @{property}: @value; } /*example*/ .test { … Read more
This is using the :hover pseudoelement in CSS3. HTML: <div id=”wrapper”> <img src=”http://placehold.it/300×200″ class=”hover” /> <p class=”text”>text</p> </div> CSS: #wrapper .text { position:relative; bottom:30px; left:0px; visibility:hidden; } #wrapper:hover .text { visibility:visible; } Demo HERE. This instead is a way of achieving the same result by using jquery: HTML: <div id=”wrapper”> <img src=”http://placehold.it/300×200″ class=”hover” /> <p … Read more
The JSF mapping and library name is missing in those URLs. If you’ve mapped your FacesServlet on *.xhtml, then those URLs should actually have been: GET http://DOMAIN:PORT/CONTEXT-ROOT/javax.faces.resource/font-awesome/3.2.1/font/fontawesome-webfont.woff.xhtml?ln=webjars&v=3.2.1 GET http://DOMAIN:PORT/CONTEXT-ROOT/javax.faces.resource/font-awesome/3.2.1/font/fontawesome-webfont.ttf.xhtml?ln=webjars&v=3.2.1 GET http://DOMAIN:PORT/CONTEXT-ROOT/javax.faces.resource/font-awesome/3.2.1/font/fontawesome-webfont.svg.xhtml?ln=webjars Essentially, you should be using #{resource} in CSS file to print the proper JSF resource URL: src: url(“#{resource[‘webjars:font-awesome/3.2.1/font/fontawesome-webfont.eot’]}&v=3.2.1”); src: url(“#{resource[‘webjars:font-awesome/3.2.1/font/fontawesome-webfont.eot’]}&#iefix&v=3.2.1”); However, as the source … Read more
As you suspect, the initial values for all these properties is not 0; it is auto. You can find their property definitions in section 9.3.2 of the spec. When an absolutely positioned box keeps all its offsets auto (i.e. you don’t modify them), it doesn’t go anywhere. It remains in the static position, which basically … Read more
According to the spec, transitions should work on grid-template-columns and grid-template-rows. 7.2. Explicit Track Sizing: the grid-template-rows and grid-template-columns properties Animatable: as a simple list of length, percentage, or calc, provided the only differences are the values of the length, percentage, or calc components in the list So, if my interpretation is correct, as long … Read more
I created a transparent png, where the outside is white, and the checkbox is partially transparent. I modified the code to put a backgroundColor on the element, and voila!, a colorized checkbox. http://i48.tinypic.com/raz13m.jpg (It says jpg, but it’s a png). I would post the example, but I don’t know of a good way to show … Read more