Estoy malgastando lineas de codigo css?

[neodani]

Buenas,

Creo que repito muchas declaraciones css, os pongo un ejemplo. Cada formulario de la página tiene el mismo aspecto gráfico pero tiene detalles que hace que ningún formulario sea igual. Ejemplo el width del formulario o alguna que otra label.

Lo que estoy haciendo son cosas así

Código CSS:

#formulario fieldset, #form_registro  fieldset, #form_preferencias  fieldset,#form_contactar fieldset, #form_amigo fieldset,#form_publicar_articulo fieldset, #form_agregar_web fieldset{
-moz-border-radius:5px 5px 5px 5px;
background-color:#EEEEEE;
border:1px solid #DDDDDE;
margin:0 0 15px;
padding:15px;
box-shadow: 3px 3px 5px #EEEEEE;
}
 

Pero creo que podría usar un único id ejemplo #formulario lo que no tengo claro es como llevar bien el resto de estilos. Seguro que vosotros lo véis más claro, estoy malgastando lineas y haciendo más engorroso mi css, verdad?

Lo que comentaba que cada formulario tiene sus propiedades...

Código CSS:

#formulario label,#form_registro label{
font-weight:bold;
font-size:11px;
font-family:'Lucida Grande',Verdana,sans-serif;
padding-left:1px;
width:270px;
float:left;
line-height:15px;
}
 
#form_contactar  label, #form_agregar_web label{
font-weight:bold;
font-size:12px;
font-family:'Lucida Grande',Verdana,sans-serif;
padding-left:1px;
width:250px;
float:left;
line-height:15px;
margin-top:6px;
}
 
#form_preferencias  label{
font-weight:bold;
font-size:12px;
font-family:'Lucida Grande',Verdana,sans-serif;
width:96px;
float:left;
line-height:15px;
}
 

¿Me proponéis algo más eficiente?

Muchas gracias por vuestra ayuda!

[_cronos2]

A lo primero, yo lo pondría así (a falta de información produciría el mismo resultado):

Código CSS:

fieldset {
-moz-border-radius:5px 5px 5px 5px;
background-color:#EEEEEE;
border:1px solid #DDDDDE;
margin:0 0 15px;
padding:15px;
box-shadow: 3px 3px 5px #EEEEEE;
}
 

A lo segundo, podrías usar un selector con las propiedades generales:

Código CSS:

label {
font-weight:bold;
font-size:12px;
font-family:'Lucida Grande',Verdana,sans-serif;
float:left;
line-height:15px;
}
 
#formulario label,#form_registro label{
font-size:11px;
padding-left:1px;
width:270px;
}
 
#form_contactar label, #form_agregar_web label{
padding-left:1px;
width:250px;
margin-top:6px;
}
 
#form_preferencias label{
width:96px;
}
 

Espero que te sirva.
Saludos (:

[neodani]

Pero si lo hago así usando el selector por defecto

Código CSS:

fieldset {
    -moz-border-radius:5px 5px 5px 5px;
    background-color:#EEEEEE;
    border:1px solid #DDDDDE;
    margin:0 0 15px;
    padding:15px;
    box-shadow: 3px 3px 5px #EEEEEE;
    }
 

Corro el riesgo que si una vez necesito un fieldset que tenga otra propiedad de margin que tengo que hacer?

#form fieldset{
margin:20px;
}

ó

fieldset .form{
margin:20px;
}

u otra forma?

Gracias

[_cronos2]

Pero siempre será mejor que tener que usar un selector kilométrico, ¿no?
Saludos (:

[neodani]

Holas,

Y puedo tener un identificador que sea #formulario con todas las propiedades de ese formulario, que si fieldset, inputs, etc... ejemplo:

#formulario fieldset
#formulario input
etc...

Y luego cada vez que necesite un formulario nuevo con ese estilo escribir

<div id="formulario"> (.............) </div> y dentro de la capa el propio formulario, de esta forma siempre tendrá ese aspecto.

Ahora bien, mi duda viene cuando tienes diferentes formularios, ejemplo Contactar y Registro de usuarios.

Cómo puedo hacer para variar mi #formulario que es comun para todos para que diferencie cuando se trata de un formulario u otro?

Ejemplo veo que el formulario contactar lo unico que cambia es el fieldset el resto es igual.

Puedo hacer algo así <div id="formulario contactar"> (.............) </div>

#formulario #contactar fieldset?
o
#formulario .contactar fieldset?
u otra forma válida?

Muchas gracias de antemano