Тэг "CSS" (12)
Sticky footer solution by Steve Hatcher ... Показать код
Fix for Internet Explorer 5.5/6/7/8 to render HTML5 documents and websites normally. Place this code into the
of document. ... Показать код
CSS: Centering Percentage Width/Height Elements
If you know the exact width/height of an element, you can center it smack dab in the middle of its parent element easily with this classic trick: top and left set to 50% and negative margins half the width and height of the element. That's great if you know the width and height of the element you're trying to center, but what if they are percentages? ... Показать код
.center {
position: absolute;
left: 50%;
top: 50%;
/*
Nope =(
margin-left: -25%;
margin-top: -25%;
*/
/*
Yep!
*/
transform: translate(-50%, -50%);
/*
Not even necessary really.
e.g. Height could be left out!
*/
width: 40%;
height: 50%;
}
CSS: Different links style
Different links style depending on the type of these links ... Показать код
/* External links */
a[href^="http://"]{
text-decoration: underline;
}
/* Emails */
a[href^="mailto:"]{
border-bottom: 1px dotted #0080FF;
}
/* PDF files */
a[href$=".pdf"]{
padding-right: 20px;
background: url(images/pdf_icon.png) no-repeat center right;
}
jQuery: Growl-like messages
Simple Growl-like messages (top-right corner of a page) ... Показать код
CSS: Table borders for ie9 & ie10
fix error with some tables in ie. ... Показать код
table{
border-top: 1px solid #000;
}
tr{
border-left:1px solid #000;
border-bottom:1px solid #000;
}
td{
border-right:1px solid #000;
}
CSS: Cross-Browser Inline-Block
…for very old browsers. ... Показать код
This is awesome
CSS: Cross-browser transparency
Cross-browser transparency. Works equally well in IE, FF, Chrome, Safari and Opera. ... Показать код
.transp-element {
filter: alpha(opacity=80); /* IE */
-khtml-opacity: 0.8; /* Safari (old) */
-moz-opacity: 0.8; /* FF */
opacity: 0.8; /* FF, Safari, Opera */
}
An CSS3 Trick to smooth big fonts. ... Показать код
h1.title{
text-shadow:-1px -1px 1px rgba(255,255,255,0.2), /* наверх и влево */
1px 1px 1px rgba(255,255,255,0.2), /* вниз и вправо */
1px 1px 1px rgba(0,0,0,0.7); /* тёмная тень */
}
CSS: Box shadow
Cross-browser CSS box shadow ... Показать код
-webkit-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.4);
-moz-box-shadow: 0 3px 4px rgba(0, 0, 0, 0.4);
box-shadow: 0 3px 4px rgba(0, 0, 0, 0.4);
CSS: Rounded corners
Cross-browser CSS rounded corners ... Показать код
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;