les comento, tengo una web en xhtml, estoy utilizando 2 estilos css externos para esta web, pero tengo un problema a la hora de validar el codigo css y la idea es basar la web en estandares por cuestiones de accesibilidad con ciertos navegadores, por ejemplo safari 2.0 con el cual la web se deforma en cuanto a diseño, ojala y alguien me pueda ayudar a solucionar el problema, muchas gracias a todos los que colaboran en clab.
saludos.
a continuacion pongo el codigo de los 2 css.
css principal:
Código :
@charset "UTF-8"; /* =CALL LIBRARY */ @import url("reset-min.css"); /* =GENERAL*/ body{ font: 62.5%/2.2em "Lucida Grande", Tahoma, Verdana, Arial, Helvetica, sans-serif; color: #000000; background: #fff; } a{text-decoration: none;color: #006699;} a:hover{ color: #000000; } hr{display: none;} strong{font-weight: bold;} ul.borderedlist li{ border-bottom: 1px dashed #d1cfcd; } ul.borderedlist li a{ padding:3px 0 0 2px; height: 26px; color: #FF9900; } ul.borderedlist li a:hover{background: #E5E5E4;color: #42423b;} /* =LAYOUT - the main layout styles */ .container{ width:900px; margin: 0 auto; position: relative; overflow:visible; background-color: #FFFFFF; } /* header layout */ #header{ height: 253px; background: #4a4841 url(../images/top_bg.jpg) top repeat-x; position: relative; } #navigation{ position: absolute; right: 0; top:20px; } /* main area layout */ #main{padding:14px 0 20px 0;} #leftcolumn{float: left;width:193px;} #center{ float: left; width:377px; padding-top: 0; padding-right: 20px; padding-bottom: 0; padding-left: 20px; } #rightcolumn{float: left;width:287px;} /* bottom layout */ #bottominfo{ border-top: 5px solid #FF9900; background: #FFFFFF; padding-bottom:25px; width: 100%; overflow: hidden; } .bottomcolumn{ float: left; width:288px; margin-right: 18px; } .bottomright{margin-right:0;} /* =HEADER - the header styles */ #header .container{height: 253px;} /* logo */ h1{ position: absolute; height: 71px; top: 15px; } h1 a{ font: 24px/24px Arial, Helvetica, sans-serif; font-weight: bold; letter-spacing: -2px; padding: 22px 9px 25px 20px; display: block; color: #fff; background: url(/images/logo_bg.gif) left top no-repeat; } h1 a:hover{color: #fff;} h1 a span{ height:71px; width: 13px; position: absolute; top:0; right: -13px; cursor: pointer; background: url(../images/logo_right.gif) right top no-repeat; } /* top navigation */ #navigation li{ float: left; padding-right: 27px; text-transform: uppercase; font-size: 1.3em; font-weight: normal; } #navigation li a{color: #fff;} #navigation li a:hover,#navigation li.active a{color: #2c2c2c;} /* message and building pic */ #banner{ position: absolute; height: 125px; color: #a49c8f; font-weight: bold; padding:0 440px 0 7px; bottom: 0; background: url(../images/building.gif) right bottom no-repeat; font-size: 1.3em; } /* =CONTENT - the content styles */ /* left column */ .leftbox{background: #006699;padding: 10px 23px 10px 23px;margin-bottom:3px;line-height:1.8em;} h3.leftbox{font-size:19px;color: #006699; background: #FF9900 url(../images/h3_bg_tall.jpg) 0 0 repeat-x;padding:5px 0 10px 23px;} h3.header_small{font-size:15px;font-weight: bold;background: #f1f0ef;padding:0 23px 5px 23px;} ul.leftbox{font-size: 1.2em;} .features{padding-top:15px;font:1.27em Arial, Helvetica, sans-serif;} #leftcolumn .leftbox p{padding-bottom:1em;line-height:1.5em; font-size:12px} /* center column */ .article_wrapper h2{color: #006699; font-size:2em;margin:10px 0;} .article_wrapper p{padding-bottom:10px;font-size:1.3em;} /* right column */ .rightbox_wrapper{ background: #eeeded; padding:5px; margin-bottom: 20px; width:277px; overflow: hidden; font-size:11px; line-height: 18px; color: #000000; } .rightbox{border: 1px dashed #d9e0e8;width:275px;overflow: hidden;padding-bottom:6px;} .product_image{ float: left;margin: 6px 0 0 6px;} .product_wrapper{ float: right; width:275px; } .product_wrapper h4{font-size:1.3em;color: #FF9900;font-weight: bold;padding-top:10px;} .product_wrapper p{font-size:1em;} .lastbox{margin:0;} /* =BOTTOM */ .bottomcolumn h3{ border-bottom: 4px solid #006699; color: #006699; font-size:18px;padding:15px 0 5px 5px; } .bottomcolumn p{ padding: 10px 35px 10px 5px; font-size: 1.2em; } .iconlist{ border-top: 1px dashed #d1cfcd; font-size: 1.2em; } ul.iconlist li a{ padding-left: 25px; background: url(../images/footer_list.jpg) left bottom no-repeat; } ul.iconlist li a:hover{background: #E9E4DE url(../images/footer_list.jpg) left top no-repeat;color: #42423b;} .enewsbox{ float: left; width: 180px; height: 17px; padding:3px 5px; border: 4px solid #006699; font-size:13px; } .button{ display: block; float: none; width: auto; line-height:1em; text-align: center; background: #006699; border: 4px solid #fff; color: #fff; cursor: pointer; margin:0; /* IE6 */ padding-top: 3px; padding-right: 3px; padding-bottom: 3px; padding-left: 3px; } /* =FOOTER */ #footer{ height: 37px; background: #4a4841 url(../images/footer_bg.jpg) 0 0 repeat-x; font-size: 1.2em; } #footer a{color: #A39D97;} #designby{ float: left; height: 23px; padding:2px 0 0 30px; margin-top: 5px; } #footer_navigation{ float: right; padding-top:7px; } #footer_navigation li{float: left;padding-left:18px;} #footer_navigation li a{text-transform:uppercase;} #footer_navigation li a:hover{color: #5699A7;}
css secundario:
Código :
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}table{border-collapse:collapse;border-spacing:0;}fieldset,img{border:0;}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal;}ol,ul {list-style:none;}caption,th {text-align:left;}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}q:before,q:after{content:'';}abbr,acronym {border:0;}