Foros del Web » Creando para Internet » CSS »

Menu texto al medio y 100% de la pagina

Estas en el tema de Menu texto al medio y 100% de la pagina en el foro de CSS en Foros del Web. Buenas, Lo que me gustaria es que en el menu este, los botones que solo tienen una linia como Inici, que aparezcan al medio del ...
  #1 (permalink)  
Antiguo 22/07/2010, 03:25
 
Fecha de Ingreso: abril-2010
Mensajes: 76
Antigüedad: 14 años
Puntos: 0
Menu texto al medio y 100% de la pagina

Buenas,

Lo que me gustaria es que en el menu este, los botones que solo tienen una linia como Inici, que aparezcan al medio del cuadro, igual que salen los de dos linias. Aqui dejo el codigo que tengo.

Y tambien que me ocupe el 100% de la pagina.

Gracias

Este es la parte del menu. Que esta en el archivo style.css
Código PHP:
/* -- Menu Main Settings -- */
#imMnMn {padding-top: -6px; }
#imMnMn ul, #imMnMn ul li {margin: 0; padding: 0; list-style: none; z-index: 1000; cursor: pointer; text-align: center; }
#imMnMn ul li {position: relative; float: left; margin-bottom: -3px; padding-bottom: 10px; }
#imMnMn ul a {display: block; text-decoration: none; width: 111.5px; padding: 13px 3px 13px 3px; height: 40px !important; height: 1%; font: bold 15px Verdana; background-color: #0D69D0; color: #FFFFFF; border: 3px solid #FF8000; } 
http://img810.imageshack.us/img810/7999/menumb.jpg


Y este todo el archivo que se llama style.css

Código PHP:
/* -- General Style -- */
#imHeader {position: relative; }
#imHeader div {position: absolute; cursor: pointer; }
body {font-size8pxvertical-alignbaseline; }
{margin0padding0; } 
.
fb {font-weightbold; } .fi {font-styleitalic; } .fu {text-decorationunderline; } 
ul.imBullet {margin0 0 0 20pxpadding0text-alignleft; } ul.imBullet li {vertical-alignmiddle; }
.
imAlign_left {text-alignleft; }
.
imAlign_center {text-aligncenter; }
.
imAlign_right {text-alignright; }
.
imAlign_justify {text-alignjustify; }
img.imImage {border0pxvertical-alignbaseline; }
.
imInvisibleh1 {positionabsolutetop: -10000pxleft: -10000px; }
.
imHidden {displaynone; }
.
imClear {clearleft; }
.
imError {padding5pxmargin10pxborder1px solid #000000; background-color: #FFFFFF; font: 11px Tahoma; text-align: center; line-height: 16pt; }
#imToolTip {position:absolute; visibility: hidden; padding: 3px; z-index: 1001; }
#imMailLink {padding-left: 20px; background: url('imemail.gif') no-repeat; }
#imZIBackg {display: none; position: absolute; text-align: center; width: 100%; background-image: url('imzibackg.png') !important; background-image: url('imblank.gif'); filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="res/imzibackg.png", sizingMethod="scale"); cursor: pointer; }
#imZIImage {background: #EEEEEE url('imziload.gif') no-repeat center center; border: 1px solid #333333; margin: 0 auto; }
#imZIImage img {margin: 7px; }
#imZICaption {font: 11px Tahoma; color: #000000; padding: 0 7px 7px 7px; }
#imLockTxt {margin-left: 10px; font: 11px Tahoma; color: #000000; min-height: 300px; height: auto !important; height: 300px; }
#imLockForm {margin: 5px auto; text-align: left; padding: 5px; width: 200px; }
#imLockAlert {background-color: red; color: white; padding: 0 5px 0 5px; }
.imLockLabel {displayblockmargin-top6px; }
.
imLockBtn {font11px Tahomacolor#000000; background-color: #C0C0C0; border: 1px solid #222222; margin: 5px; }
.imLockFld {font11px Tahomacolor#000000; border: 1px solid #222222; margin: 4px 0; vertical-align: middle; }

/* -- Menu Main Settings -- */
#imMnMn {padding-top: -6px; }
#imMnMn ul, #imMnMn ul li {margin: 0; padding: 0; list-style: none; z-index: 1000; cursor: pointer; text-align: center; }
#imMnMn ul li {position: relative; float: left; margin-bottom: -3px; padding-bottom: 10px; }
#imMnMn ul a {display: block; text-decoration: none; width: 111.5px; padding: 13px 3px 13px 3px; height: 40px !important; height: 1%; font: bold 15px Verdana; background-color: #0D69D0; color: #FFFFFF; border: 3px solid #FF8000; }

/* -- Menu Main Hover Settings -- */
#imMnMn ul a:hover, #imMnMn ul li:hover a, #imMnMn ul li.iehover a {background-color: #FFFFFF; color: #007DCD; }

/* -- Menu Main Images -- */
#imMnMn a.imMnLv {background-image: url('imiconmenu.gif'); background-position: center right; background-repeat: no-repeat; }

/* -- Menu Level -- */
#imMnMn ul ul {display: none; position: absolute; top: 0px; left: 122px; }
#imMnMn ul ul ul {top: 0; left: 145px;}
#imMnMn ul li:hover li a, #imMnMn ul li.iehover li a, #imMnMn ul li:hover li:hover li a, #imMnMn ul li.iehover li.iehover li a, #imMnMn ul li:hover li:hover li:hover li a, #imMnMn ul li.iehover li.iehover li.iehover li a {padding: 3px; height: auto !important; height: 1%; font: 11px Tahoma; background-color: #FFFFFF; color: #000000; border: 5px solid #000000; filter: progid:DXImageTransform.Microsoft.Alpha(opacity=85); width: 134px; text-align: left; }
#imMnMn ul li li {padding-bottom: 0; margin-bottom: -5px; }
#imMnMn ul li:hover li a:hover, #imMnMn ul li:hover li:hover a, #imMnMn ul li.iehover li a:hover, #imMnMn ul li.iehover li.iehover a, #imMnMn ul li:hover li:hover li a:hover, #imMnMn ul li:hover li:hover li:hover a, #imMnMn ul li.iehover li.iehover li a:hover, #imMnMn ul li.iehover li.iehover li.iehover a, #imMnMn ul li:hover li:hover li:hover li a:hover, #imMnMn ul li.iehover li.iehover li.iehover li a:hover {background-color: #000000; color: #FFFFFF; }
#imMnMn ul li:hover ul ul, #imMnMn ul li:hover ul ul ul, #imMnMn ul li.iehover ul ul, #imMnMn ul li.iehover ul ul ul {display: none;}
#imMnMn ul li:hover ul, #imMnMn ul ul li:hover ul, #imMnMn ul ul ul li:hover ul, #imMnMn ul li.iehover ul, #imMnMn ul ul li.iehover ul, #imMnMn ul ul ul li.iehover ul {display: block;}

/* -- Menu Sub -- */
#imPageSub {width: 716px; padding-left: 4px; float: right; background: url('imsubmnuline.gif') repeat-y 2px; }
#imMenuSub {width: 116px; float: left; padding-top: 10px; }
#imMenuSub ul {list-style: none; margin: 0; padding: 0; border: none; }
#imMenuSub li.imMenuSubCur, #imMenuSub ul a {height: auto !important; height: 0%; padding: 4px 3px 4px 3px; font: 11px Tahoma; color: #000000; border-bottom: 1px solid #C0C0C0; }
#imMenuSub li.imMenuSubCur {font-weight: bold; }
#imMenuSub ul a:link, #imMenuSub ul a:active, #imMenuSub ul a:visited {display: block; text-decoration: none; }
#imMenuSub ul a:hover, #imMenuSub ul a:focus {background-color: #000000; color: #FFFFFF; }

/* -- Texts Style -- */
h2 {margin0px 0px 4px 10pxpadding2px 0 0 0fontbold 19px Tahomacolor#000000; text-align: left; height: 23px; }
#imPathTitle {margin: 0px 0px 8px 10px; padding: 2px 0 0 0; font: 9px Tahoma; color: #808080; text-align: left; height: 13px; }
.imDefText {padding2px 0 0 0font13px Tahomacolor#000000; text-align: left; height: 17px; }
.fc0 {color#000000; }
#imFooterSiteMap {margin: 8px 0px 0px 10px; padding: 2px 0 0 0; font: 11px Tahoma; color: #000000; text-align: center; height: 15px; }
#imFooterSiteMap a:link, #imFooterSiteMap a:active, #imFooterSiteMap a:visited, #imFooterSiteMap a:hover {color: #000000; text-decoration: none; }
#imFooterSiteMap a:hover {color: #000000; text-decoration: underline; }
#imFooter_L, #imFooter_R {padding: 2px 0 0 0; font: 11px Tahoma; color: #000000; text-align: left; height: 15px; }
#imFooter a:link, #imFooter a:visited, #imFooter a:hover, #imFooter a:active {color: #000000; text-decoration: none;}
/* -- Links Style -- */
a.ImLink  {text-decoration:underline; }
a.ImLink:link {color#0000FF; }
a.ImLink:visited {color#C000C0; }
a.ImLink:hover {color#0000FF; } 
  #2 (permalink)  
Antiguo 23/07/2010, 16:36
 
Fecha de Ingreso: abril-2010
Mensajes: 76
Antigüedad: 14 años
Puntos: 0
Respuesta: Menu texto al medio y 100% de la pagina

Nadie me puede ayudar?

Gracias
  #3 (permalink)  
Antiguo 23/07/2010, 20:58
 
Fecha de Ingreso: enero-2009
Ubicación: Uruguay
Mensajes: 121
Antigüedad: 15 años, 3 meses
Puntos: 4
Respuesta: Menu texto al medio y 100% de la pagina

no entendi muy bien lo que estas haciendo pero si es la botonera al 100% con los textos alineados quizas te sirva esto:

*{margin:0;padding:0;}
#imMnMn {padding:10px 0 0 .5%;width:99.5%;}
#imMnMn ul{list-style:none;}
#imMnMn ul li{float:left;width:19.6%;padding-left:.5%;}
#imMnMn ul .primero{padding:0;}
#imMnMn ul a {display:block;text-decoration:none;text-align:center;padding:10px 0 10px 0;font:bold 15px Verdana;background-color:#0D69D0;color:#FFFFFF;overflow:hidden;}

19.6% (es la cuenta de 98/5) son 5 botones los que use.
al primero le aplicas una class="primero"

Saludos
__________________
www.sandant.com - Blog de Programacion y mucho mas

WWW.SPEDEVIGNER.COM SE DEJARA DE USAR EN UN MES
  #4 (permalink)  
Antiguo 28/07/2010, 10:15
 
Fecha de Ingreso: abril-2010
Mensajes: 76
Antigüedad: 14 años
Puntos: 0
Respuesta: Menu texto al medio y 100% de la pagina

exxqizofrenicoo muchas gracias por su ayuda, ma ido muy bien el codigo que me has dado porque me queda al 100% de la pagina como queria. Aora el el unico problema que tengo es que algunos botones me quedan mas gordos i otros mas delgados. Aver si me puedes ayudar. Aqui te e dejado el codigo tuyo con dos canvios pequeños.

Gracias por todo.

Aqui te dejo de la imagen de como esta aora.

http://img514.imageshack.us/img514/9481/sinttulo3dbs.jpg

Aqui el codigo modificado.

Código PHP:
*{margin:0;padding:0;}
#imMnMn {padding:0px 0 0 0;width:100%;}
#imMnMn ul{list-style:none;}
#imMnMn ul li{float:left;width:12.5%;padding-left:0%;}
#imMnMn ul .primero{padding:0;}
#imMnMn ul a {display:block;text-decoration:none;text-align:center;padding:10px 0 10px 0;font:bold 15px Verdana;background-color:#0D69D0;color:#FFFFFF;overflow:hidden;border: 3px solid #FF8000; } 
  #5 (permalink)  
Antiguo 29/07/2010, 03:37
Avatar de emal011  
Fecha de Ingreso: julio-2004
Ubicación: Munich
Mensajes: 211
Antigüedad: 19 años, 9 meses
Puntos: 2
Respuesta: Menu texto al medio y 100% de la pagina

width: auto;
width: 100% !important;
display: inline-block;
__________________
El graduado en Ciencias pregunta "¿Por qué funciona?"
El graduado en Ingenieria pregunta "¿Cómo funciona?"
El graduado en Artes Liberales pregunta "¿Quiere papas fritas con eso?"

Etiquetas: medio
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:02.