Hola que tal, el siguiente código tiene como objetivo mostrar un menu dispuesto horizontalmente con una imágen de fondo. El problema es que de ninguna forma puedo centrar el texto con respecto a la imágen de fondo y tampoco sé por qué hay mas espacio entre cada boton a medida que se alejan del margen izquierdo.
Desde ya agradezco si alguien puede darme una mano con esto. Hasta la próxima.
Javier.
<style type="text/css">
<!--
#principal {width:750px; margin:0px auto; }
h1#top_fondo {background-color: #000; height: 140px; width: 750px; margin: 0px; }
#menu_top {position:absolute; width:750px; margin:0; margin-left:20px; padding:0; top:100px; }
#menu_top ul li {padding:2px 32px 5px 20px; background:url(bg_menu.gif) no-repeat; list-style:none; display:inline; }
#menu_top ul li a {color:#EED5B6; text-decoration:none; text-align:center; }
-->
</style>
<body>
<div id="principal">
<h1 id="top_fondo" title="Posgrado"></h1>
<div id="menu_top">
<ul>
<li><a href="#"> Principal </a></li>
<li><a href="#"> Conozcanos </a></li>
<li><a href="#"> Plan </a></li>
<li><a href="#"> Preinscripción </a></li>
<li><a href="#"> Contactese </a></li>
</ul>
</div>
</div>
</body>
usando las tradicionales tablas se avanza un poco en el centrado, ademas soportan css para imagen de fondo, espacio lateral, centrado de texto, etc... una aproximacion (solo para nsn):
<html><head><style>
table {width:750px;height:140px;background-color:#000000;padding-top:13.8%;}
td {text-align:center;width:20%;color:#EED5B6;background:url(bg_menu.gif) no-repeat center;}
a {color:#EED5B6; text-decoration:none; text-align:center; }
</style></head><body>
<p style="text-align:center">
<table border="0"><tr></tr><tr>
<td height="10"><a href="">principal</a></td>
<td>conozcanos</td>
<td>plan</td>
<td>preinscripcion</td>
<td>contactese</td>
</tr></table></p></body></html>
este es uno de los casos en que nsn supera a msie; en msie se obtiene una tabla con celdas que ocupan el 100% de la altura y texto no centrado verticalmente, pero en nsn se obtiene una tabla con celdas que ocupan el 20% situadas abajo y con el texto centrado vertical y horizontalmente junto con la imagen, tal como se indica en el css.
jbosch(vosk)
HTML {PADDING: 5px 0px 0px 0px; BACKGROUND: #ececec; MARGIN: 0px; FONT: 9px Verdana, Arial, Helvetica, sans-serif;}
BODY {PADDING: 5px 0px 0px 0px; BACKGROUND: #ececec; MARGIN: 0px; FONT: 9px Verdana, Arial, Helvetica, sans-serif;}
A:link {COLOR: Gray; TEXT-DECORATION: none;}
A:hover {COLOR: Red; TEXT-DECORATION: underline;}
A:visited {COLOR: Gray; TEXT-DECORATION: none;}
#container {PADDING: 0px 0px 0px 0px; BACKGROUND: White; MARGIN: 5px auto auto ; WIDTH: 778px;}
#head {PADDING: 0px 0px 0px 0px; BACKGROUND: White; MARGIN: 0px; WIDTH: 100%; HEIGHT: 57px;}
#logo {PADDING: 0px 0px 0px 0px; BACKGROUND: url(includes/images/logo.gif); MARGIN: 0px; WIDTH: 213px; HEIGHT: 57px;}
"Container" se centra al establecerlos valores Margin en auto solo establesco el top pruebalo solo agregar el Div container y veras el centrado.
Saludos Manuel
pon style="text-align:center;" y ya esta.
Amigos tengo este problema a ver si pueden solucionarmelo. soy novato en estas lides, aunque ya he leído muchos ejemplos y cosas y aún no consigo lo que deseo.
Tengo diseñado una página web, y la parte baja q es una información del site. El problema radica al cambiar de resolución de pantalla, ya que la he diseñado para 1024, cuando alguien tiene la resolucion a 800, pues el div aparece en el centro pero no de la forma q aparece en 1024, por lo cual se afea todo el diseño. Lo que deseo es q se mantenga los mismos margenes cuando cambie de resolución de pantalla a pantalla, aqui les transcribo el css y parte del html, espero sus respuesta
}
Para cuando se defina bien como arreglar los ccs
#siteInfo {
position: inherit;
/*este lo he cambiado por 100% e igual sigue mal */
width: 72%;
border :1px solid #cccccc;
font-size : 100%;
color : #cccccc;
}
parte del html, le precede una tabla de 737 px de ancho
<div id="siteinfo">
<span class="Estilo15"><a href="javascript:;" onClick="window.open...etc, etc</span>
</div>
Espero me puedan ayudar, la linea de Html la he cambiado mucho, esto fue lo anterior, porque he cambiado todo por una tabla, porque no encuentro la forma de mantener el diseño, la position la he cambiado de todas formas y se sigue viendo mal, espero su ayuda y aportes, gracias
Lo mejor que puedes hacer es rediseñar el sitio para 800x600.
Saludos!
Hola que tal nesecito que en un parrafo la segunda linea me aparesca un poco mas a la derecha, como si fuera un sangrado pero para las lineas a partir de la segunda.
El problema es que cuando le doy text indent esto lo aplica a la primera linea y yo lo nesecito a partir de la segunda linea del parrafo.
Ej: Esta es la primera linea
Y esta es la segunda
Esta la tercera.
Espero que halla una solución modificando solamente el css. Gracias
Si te solucionó el problema pulsa en G+1