Hola de nuevo chicos!
Ya estoy terminando mi primera pagina web. Ahora me estoy dedicando a colocarle el formato al texto.
Tengo un div superior en donde coloque un mini menu. Al colocar al menu el texto que le corresponde no tuve problema.
Tuve problema despues de colocarle el tag de <p> en cada sección. Las letras se me salieron de lugar y no se como corregirlo esto.
Es lo que esta en el circulo rojo, las flechas rojas indican en donde deben de estar posicionadas esas letras.
Les dejo la web:
http://www.mediafire.com/?tuwj178ednuir1l
O si lo prefieren les dejo los estilos:
Código PHP:
@charset "utf-8";
#contenedor {
width: 998px;
margin-right: auto;
margin-left: auto;
overflow: hidden;
background-image: url(../img/bg2.jpg);
background-repeat: repeat;
border-left: 1px solid #ffffff;
border-right: 1px solid #ffffff;
}
body {
margin: 0px;
background-color: #99bcd5;
}
#contenedor #cabecera #contenedor_izquierdo {
width: 178px;
margin-left: 4px;
float: left;
margin-top: 210px;
}
#contenedor #cabecera #contenedor_central {
width: 625px;
margin-left: 4px;
float: left;
margin-top: 200px;
}
#contenedor #cabecera #contenedor_derecho {
width: 178px;
margin-left: 4px;
float: left;
margin-top: 210px;
}
#contenedor #cabecera {
background-image: url(../img/header.jpg);
background-repeat: no-repeat;
overflow: hidden;
background-position: center top;
width: 998px;
background-attachment: scroll;
}
#contenedor #cabecera #contenedor_central #con_top {
background-image: url(../img/cont_top.gif);
background-repeat: no-repeat;
height: 37px;
width: 623px;
float: left;
background-attachment: scroll;
background-position: center bottom;
margin-right: 1px;
margin-left: 1px;
}
#contenedor #cabecera #contenedor_central #con_bottom {
background-attachment: scroll;
background-image: url(../img/cont_bottom.gif);
background-repeat: no-repeat;
float: left;
height: 10px;
width: 623px;
background-position: center top;
margin-right: 1px;
margin-left: 1px;
margin-top: 0px;
padding-top: 0px;
}
#contenedor #cabecera #contenedor_izquierdo #nav_menu {
background-attachment: scroll;
background-image: url(../img/nav_menu.gif);
background-repeat: no-repeat;
background-position: center bottom;
float: left;
height: 59px;
width: 176px;
margin-right: 1px;
margin-left: 1px;
}
#contenedor #cabecera #contenedor_izquierdo #nav_top {
background-attachment: scroll;
background-image: url(../img/nav_top.gif);
background-repeat: no-repeat;
background-position: center bottom;
float: left;
height: 59px;
width: 176px;
margin-right: 1px;
margin-left: 1px;
margin-top: 20px;
}
#contenedor #cabecera #contenedor_derecho #nav_face {
background-attachment: scroll;
background-image: url(../img/nav_face.gif);
background-repeat: no-repeat;
background-position: center bottom;
float: left;
height: 64px;
width: 176px;
margin-right: 1px;
margin-left: 1px;
}
#contenedor #cabecera #contenedor_derecho #nav_others {
background-attachment: scroll;
background-image: url(../img/nav_others.gif);
background-repeat: no-repeat;
background-position: center bottom;
float: left;
height: 64px;
width: 176px;
margin-right: 1px;
margin-left: 1px;
margin-top: 20px;
}
#contenedor #cabecera #contenedor_derecho #nav_friends {
background-attachment: scroll;
background-image: url(../img/nav_friends.gif);
background-repeat: no-repeat;
background-position: center bottom;
float: left;
height: 64px;
width: 176px;
margin-right: 1px;
margin-left: 1px;
margin-top: 20px;
}
#contenedor #cabecera #contenedor_izquierdo #nav_links {
background-attachment: scroll;
background-image: url(../img/nav_links.gif);
background-repeat: no-repeat;
background-position: center bottom;
float: left;
height: 59px;
width: 176px;
margin-right: 1px;
margin-left: 1px;
margin-top: 20px;
}
.nav_bottom {
background-attachment: scroll;
background-image: url(../img/nav_bottom.gif);
background-repeat: no-repeat;
background-position: center top;
float: left;
height: 10px;
width: 176px;
margin-right: 1px;
margin-left: 1px;
}
.nav_bg {
background-attachment: scroll;
background-image: url(../img/nav_bg.gif);
background-repeat: repeat-y;
background-position: center center;
float: left;
width: 176px;
margin-right: 1px;
margin-left: 1px;
}
#contenedor #cabecera #contenedor_central #con_mid {
background-image: url(../img/cont_mid.gif);
background-repeat: repeat-y;
width: 623px;
float: left;
background-attachment: scroll;
background-position: center center;
margin-right: 1px;
margin-left: 1px;
}
#contenedor #footer {
background-image: url(../img/footer.jpg);
background-repeat: no-repeat;
background-position: center top;
height: 175px;
width: 998px;
}
#contenedor #cabecera #top_nav {
height: 37px;
width: 506px;
margin-left: 485px;
margin-right: 7px;
float: left;
margin-top: 0px;
}
#contenedor #cabecera #top_nav #top_nav_home {
float: left;
width: 106px;
height: 24px;
margin-left: 5px;
}
#contenedor #cabecera #top_nav #top_nav_forums {
float: left;
width: 106px;
height: 24px;
margin-left: 5px;
}
#contenedor #cabecera #top_nav #top_nav_cp {
float: left;
width: 106px;
height: 24px;
margin-left: 5px;
}
#contenedor #cabecera #top_nav #top_nav_client {
float: left;
width: 106px;
height: 24px;
margin-left: 5px;
}
Código PHP:
@charset "utf-8";
#top_nav_home p {
font-size: 16px;
font-family: Tahoma, Geneva, sans-serif;
font-weight: normal;
text-align: center;
padding-top: 0px;
}
#top_nav_forums p {
font-size: 16px;
font-family: Tahoma, Geneva, sans-serif;
font-weight: normal;
text-align: center;
padding-top: 0px;
}
#top_nav_cp p {
font-size: 16px;
font-family: Tahoma, Geneva, sans-serif;
font-weight: normal;
text-align: center;
padding-top: 0px;
}
#top_nav_client p {
font-size: 16px;
font-family: Tahoma, Geneva, sans-serif;
font-weight: normal;
text-align: center;
padding-top: 0px;
}
Cualquier ayuda como siempre sera apreciada. Gracias!