von Daniel Stahl

Contao CSS Reset

Jeder Browser interpretiert Webseiten auf seine eigene Weise. Besonders bei der Darstellung, also beim CSS sind sie oft sehr eigen. Deswegen sollte man, bevor man mit dem eigentlichen Stylen beginnt, weitestgehend die CSS Attribute auf einen einheitlichen Standard bringen. Der folgende Code ist eine leichte Abwandlung von Eric Mayers CSS-Reset den ich für Contao Installationen nutze.

 

/******************* start-reset **********************/
/* http://meyerweb.com/eric/tools/css/reset/ 
 * v2.0 | 20110126
 * License: none (public domain)
 */
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, 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,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
.mod_article *[class*="ce_"],
.mod_article *[class*="mod_"]{ 
        margin-left: 0px;
        margin-right: 0px;
}
.mod_article *[class*="layout_"]>*, 
.mod_article *[class*="event_"]>* {
        margin-left: 0px;
        margin-right: 0px;
}
/* Entfernt unsichbaren Rand unter img Tags */
img{
        display: block;
        vertical-align: bottom; 
}
/******************* end-reset **********************/

Zurück