Comunidad de diseño web y desarrollo en internet online

Necesito ayuda con validacion de estilos css

Citar            
MensajeEscrito el 11 May 2008 09:59 am
hola, como estan?

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;}

Por Merca-Tech

51 de clabLevel



 

msie7
Citar            
MensajeEscrito el 11 May 2008 10:14 am
BOFHs:
cerrad, y seguir en este, que está más actualizado.

Por El Oso Amoroso

Claber

1780 de clabLevel

6 tutoriales

 

Madrid, España, Europa, Eurasia, La Tierra, Sist.Solar, Vía Láctea, UNIVERSO

firefox

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.