Advanced Search

CSS Document Starter, with Reset

/ Published in: CSS
Save to your folder(s)

Expand | Embed | Plain Text

Copy this code and paste it in your HTML 
  1. /* 1. RESET (Original by Erik Meyer: http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/)
  2. ------------------------------------------------------------------*/
  3. 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;background:transparent;font-weight:inherit;font-style:inherit;font-size:100%;font-family:inherit;vertical-align:baseline;}
  4. html {-webkit-font-smoothing: antialiased;}
  5. body{line-height:1;text-rendering: optimizeLegibility;}
  6. ol,ul{list-style:none;}
  7. blockquote,q{quotes:none;}
  8. blockquote:before,blockquote:after,q:before,q:after{content:'';content:none;}
  9.  
  10. /* remember to define focus styles! */
  11. :focus{outline:0;}
  12.  
  13. /* remember to highlight inserts somehow! */
  14. ins{text-decoration:none;}
  15. del{text-decoration:line-through;}
  16.  
  17. /* tables still need 'cellspacing="0"' in the markup */
  18. table{border-collapse:collapse;border-spacing:0;}
  19.  
  20. /* HTML5 tags */
  21. article, aside, figure, figure img, figcaption, hgroup, footer, header, nav, section, video, object {display:block;}
  22. figure {position: relative;}
  23. figure img {width: 100%;}
  24.  
  25.  
  26. /* 2. GLOBAL CLASSES
  27. ------------------------------------------------------------------*/
  28. .clearer,.clear{clear:both;}
  29.  
  30. .float-left,.alignleft,.nav-previous{float:left;}
  31. .float-right,.alignright,.nav-next{float:right;}
  32. .alignnone{float:none;}
  33. .aligncenter{margin:0 auto;display:block;}
  34.  
  35. .text-left{text-align:left;}
  36. .text-right{text-align:right;}
  37. .text-center,.center{text-align:center;}
  38. .text-justify{text-align:justify;}
  39. .uppercase{text-transform:uppercase;}
  40. .capitalize{text-transform:capitalize;}
  41. 	i.capitalize{font-style:normal;}
  42. .letter-spacing{letter-spacing:1px;}
  43.  
  44. .bold{font-weight:bold;}
  45. .italic{font-style:italic;}
  46. .underline{border-bottom:1pxsolid;}
  47. .highlight{background:#ffc;}
  48. .position_inside{list-style-position:inside;}
  49.  
  50. img{border:0;}
  51. img.alignleft{float:left;margin-right:2%;}
  52. img.alignright{float:right;margin-right:0;margin-left:2%;}
  53. img.aligncenter{float:none;}
  54.  
  55. .nomargin{margin:0!important;}
  56. .nopadding{padding:0!important;}
  57. .noborder{border:0;}
  58. .noindent{margin-left:0;padding-left:0;}
  59. .nobullet{list-style:none;list-style-image:none;}
  60. .nodisplay,.hide,.hidden,.screen-reader-text,.ui-tabs-hide,span.type{display:none;}
  61.  
  62. #accessibility{position:absolute;top:-9999px;font-size:1px;}
  63. .ie6-message{display: none;}
  64. * html .ie6-message{display: block;}
  65.  
  66. /* 3. STYLING
  67. ------------------------------------------------------------------*/
  68. body{
  69. 	font: normal 62.5%/1.5em "Helvetica Neue", Helvetica,Arial, "Nimbus Sans", sans-serif; 
  70. 	text-shadow: 0 1px 0px rgba(0, 0, 0, 0.6);
  71. }
  72.  
  73. small{font-size: 12px;}
  74. strong,b,.bold { font-weight: bold; }
  75. em,i,cite{ font-style:italic;}
  76. .requi,.emphasis {color:red;}
  77.  
  78. hr{width:100%;border:0;clear:both;}
  79.  
  80.  
  81. /* 4. LINKS & BUTTONS
  82. ------------------------------------------------------------------*/
  83.  
  84.  
  85. /* 5. LAYOUT
  86. ------------------------------------------------------------------*/
  87.  
  88.  
  89. /* 6. TABLES
  90. ------------------------------------------------------------------*/
  91.  
  92.  
  93. /* 7. MEDIA QUERIES
  94. ------------------------------------------------------------------*/

Report this snippet


Comments

RSS Icon Subscribe to comments

You need to login to post a comment.