Bienvenido al fantástico mundo del CSS
Ahora, una sugerencia que te va a evitar muchos problemas: OLVIDATE DE LAS TABLAS... por ejemplo:
Código HTML:
<div id="superior">
<table align="center">
<tr>
<td><img src="image.gif" width="75px" height="75px"></td>
<td class="titleSAPB">SAPB</td>
</tr>
</table>
</div> ¿para que querés esa tabla?
Conseguis lo mismo (en realidad conseguís más y mejor) con mucho menos código:
Código:
<div id="superior">
<img src="image.gif" width="75px" height="75px" align="absmiddle" alt="Texto">
<h1>SAPB</h1>
</div>
y en tu CSS...
h1{text-align:center;}
Como ves, si seguimos esta "filosofía" en el resto del archivo, podemos bajar drásticamente la cantidad de código, y por lo tanto (entre otras cosas) hacer los archivos más livianos (en una web extensa se nota) y hasta más comprensibles para los buscadores.
No te olvides del atributo alt en las imágenes, se usa como texto alternativo en el caso que por x razón no se pueda ver la imagen (imagenes deshabilitadas, navegador solo texto, etc.)
Además vi que en tu CSS repetís muchos atributos... CSS se traduce al Español como "Hoja de estilo en cascada" y justamente no estas usando las ventajas de la parte "C" de casacada. A grosso modo queire decir que los elementos (la gran mayoría) de un atributo "padre" se heredan a un elemento "hijo"... por ejemplo, el mayor nivel de padre lo da el elemento html (por lo de <html><head></head><body>, bla,bla) ya que todos los demás elementos estan contenidos en el, así que si en tu CSS definís atributos para el "head" y el "body" (generalemnte se definen en conjunto para evitar posibles "problemas") ya se defienen para el resto de los elementos hijos, por ejemplo con:
html, body { font-family:tahoma,verdana;}
ya estás definiendo el estilo de letra que se va a usar en todos tus elementos hijos (salvo que especifiques lo contrario). Como ves te ahorrás un montón de líneas, solo con este "pequeño" detalle... en las FAQs de CSS hay muy buenos manuales que te recomeindo leer.
También te puedo decir que algunos atributos se pueden abreviar así que en vez de escribir:
border-bottom-color:#799B18;
border-bottom-style:solid;
border-bottom-width:thick;
podés solamente escribir:
border-bottom:thick solid #799B18;
otra cosa: te recomiendo el uso de la unidad
em para el manejo de textos, no
px.
Aquí te dejo
la explicación.
Bueno, ahora es tu turno de investigar, estudiar, hacer... y deshacer
