@CHARSET “ISO-8859-1″;
*
{
margin:0;
padding:0;
font-size: 11px;
font-family: tahoma,”lucida grande”,verdana,arial,sans-serif;
color: #333;
text-align: left;
direction: ltr;
}
img { border:none; }
a { text-decoration:none; }
textarea { resize: none; }
.TabContainer {
height:auto;
margin:0;
padding:0;
width:510px !important;
overflow:hidden !important;
overflow-x:hidden !important;
overflow-y:hidden !important;
}
Category Archives: CSS
How to remove dotted border on link
I had this issue on Firefox, that when you click on <a> tag it get this dotted border. so how to remove this…
a:active, a:focus, input[type="image"] { outline: 0;}
Best way to clear floats
Let say you wanted an image with description on its right end. by using ”overflow:hidden; or overflow:auto”
HTML :
<div style="width:510px;border:solid 1px red;"> <div style="float:left;"> <img src="" style="width:200px;200px;border:solid 1px red;" /> </div> <div style="overflow:hidden;"> asd fsdafsd sdafdsaefs adfasdfasd fadsadf asd fsdafsd sdafdsaefs adfasdfasd fadsadf asd fsdafsd sdafdsaefs adfasdfasd fadsadf asd fsdafsd sdafdsaefs adfasdfasd fadsadf </div> </div>
How to make 3D button without images
/* CSS3 Buttons Without Images */
button {
-moz-border-radius:5px;
-webkit-border-radius:5px;
-moz-box-shadow:0px 0px 2px rgba(0,0,0,0.4);
-webkit-box-shadow:0px 0px 2px rgba(0,0,0,0.4);
color:rgba(0,0,0,0.9);
text-shadow:1px 1px 0px rgba(255,255,255,0.8);
border:1px solid rgba(0,0,0,0.5);
background:-webkit-gradient(linear,0% 0%,0% 100%,from(rgba(255,255,255,1)),to(rgba(185,185,185,1)));
background:-moz-linear-gradient(top,rgba(255,255,255,1),rgba(185,185,185,1));
padding:5px 5px 5px 5px;
}
button:hover {
background:rgba(240,240,240,1);
}
button:active, button:focus {
background:-webkit-gradient(linear,0% 100%,0% 0%,from(rgba(255,255,255,1)),to(rgba(185,185,185,1)));
background:-moz-linear-gradient(bottom,rgba(255,255,255,1),rgba(185,185,185,1));
}
button:disabled {
color:rgba(0,0,0,0.4);
text-shadow:1px 1px 0px rgba(255,255,255,0.5);
background:rgba(220,220,220,1);
}
/* ================================ */
Continue Add to Shopping Cart Reset Cancel
CSS Image Sprite Generator
CSS Optimizer
Disable Textarea resizing
in NON-IE browser, default textarea behave as resizeable. to disable it
textarea { resize:none; }
textarea {resize:vertical; }
textarea { resize:horizontal; }
CSS hack for IE on all Mode (\9)
_hack :
- Does not work IE8 Standard Mode, IE7 Standard Mode
- Best work in IE6, IE7,IE8 Quirks Mode
* hack :
- Does not work on IE8 Standard Mode
- Best work in IE 6/7/8 Quirks Mode
\9 :
- Works on all IE version either Quirks Mode or Standard Mode
- Do not use this on Background Image as for experience , prefer to use _hack
- Ex : _background(http://image.com/file.jpg);
Ex:
top: 17px; /* For Non-IE */ top: 8px\9; /* For IE */
Auto Resize image base on minimum width
this works on FF,CH,IE
. img {
max-width: 460px;
width: expression(this.width > 460 ? 460: true);
}
Eric Meyer CSS Reset Rule
/* http://meyerweb.com/eric/tools/css/reset/ */
/* v1.0 | 20080212 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
