Retroceder   Foros del Web > Diseño de Sitios web > CSS

Respuesta
 
Herramientas Desplegado
Antiguo 17-mar-2008, 19:20   #1 (permalink)
pegasomx ha deshabilitado el karma
 
Fecha de Ingreso: marzo-2008
Mensajes: 4
menu en css me muestra el texto del ultimo elemento en la parte inferior

que tal amigos una molestia estoy haciendo un portal y tengo un problema estoy hacienod un portal para que funcione en IE7, IE6 y Firefox principalmente, el detalles que el menu que hice o copie jejej funciona bien en ie7 y firefox el problema me lo da con ie6 el cual hace que me muestre el texto del ultimo elemento del menu en la parte inferior, para esto estoy usando layers para maquear el portal , le anexo los dato sy un ejemplo saludos


espero que me puedan auxiliar saludos

ejemplo vivo
http://geeksquadsolutions.com.mx/cw/


saluodos



menu.css
Código:
@charset "utf-8";
/* CSS Document */

a
{
		display:block;
		height:43px;
		padding-top:0px;
		float:left;
		text-indent: -99999em;
}

a#menu_home	{background:url(../images/menu-01.jpg) top left no-repeat; width:70px;}
a#menu_home:hover {background-position:0 -43px;}
	
a#menu_products	{background:url(../images/menu-02.jpg) top left no-repeat; width:88px;}
a#menu_products:hover {background-position:0 -43px;}	

a#menu_services	{background:url(../images/menu-03.jpg) top left no-repeat; width:83px;}
a#menu_services:hover {background-position:0 -43px;}

a#menu_about	{background:url(../images/menu-04.jpg) top left no-repeat; width:60px; }
a#menu_about:hover {background-position:0 -43px;}

a#menu_resources {background:url(../images/menu-05.jpg) top left no-repeat; width:98px;}
a#menu_resources:hover {background-position:0 -43px;}

a#menu_news	{background:url(../images/menu-06.jpg) top left no-repeat; width:56px;}
a#menu_news:hover {background-position:0 -43px;}

a#menu_order	{background:url(../images/menu-07.jpg) top left no-repeat; width:118px;}
a#menu_order:hover {background-position:0 -43px;}

a#menu_employment	{background:url(../images/menu-08.jpg) top left no-repeat; width:105px;}
a#menu_employment:hover {background-position:0 -43px;}

a#menu_contact_us	{background:url(../images/menu-09.jpg) top left no-repeat; width:88px;}
a#menu_contact_us:hover {background-position:0 -43px;}
menu.php
Código:
<a href="index.php" id="menu_home" >home</a>
<a href="index.php?action=produtcs" id="menu_products">Products</a>
<a href="index.php?action=services" id="menu_services">Services</a>
<a href="index.php?action=about" id="menu_about">About</a>
<a href="index.php?action=resources" id="menu_resources">Resources</a>
<a href="index.php?action=news" id="menu_news">News</a>
<a href="index.php?action=order" id="menu_order">Order</a>
<a href="index.php?action=employment" id="menu_employment">Employment</a>
<a href="index.php?action=contact_us" id="menu_contact_us">Contact</a>

index.php
Código:
<?php

?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>C &amp; W</title>
<link href="stylesheet.css" rel="stylesheet" type="text/css" />
<link href="include/menu.css" rel="stylesheet" type="text/css" />
</head>

<body class="home">

<div class="Full_Body">

<div id="container">
  <div id="header">
  	<div id="header_left" style="text-align:left; float:left; "><img src="http://www.forosdelweb.com/images/header01.jpg" alt="header" width="356" height="120" /></div>
     <div id="header_right" style="text-align:right; float:right; "><?php // include ('swf/cw_truck.php') ?></div>

  	<!-- end #header --></div>
	<div id="menu">
    			
			<?php include ('include/menu.php');?>
    <!-- end #menu --></div>
  <div id="middle_information" >
    <?php
        //include_once ('include/' . $content);					  
    ?>
    <!-- end #middle_information -->
  </div>

   <div id="footer_img" style="float:left; " >
   <img src="http://www.forosdelweb.com/images/footer.jpg" alt="imagen"  width="646" />
   </div>
   <div id="footer_logo" > 
   <img src="http://www.forosdelweb.com/images/footerlogo.jpg" alt="logo" width="120"  />
   </div>
   <!-- end #footer --></div>
<!-- end #container --></div>
<!-- end #Full_Class_Body --></div>

</body>
</html>

styleesheet.css

Código:
@charset "utf-8";
/* CSS Document */

body {
  font: 100% Verdana, Arial, Helvetica, sans-serif;
  background: #666666;
  margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
  padding: 0;
  text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
  color: #FFFFFF;
  background-color:#000000;
  padding-top:10px;
  padding-bottom:15px;
  
}

h2
{
	font-family:Georgia;
	color:#5A5B5A;
	padding-top:-10px;
	padding-left:20px;
	font-size:20px;

}

.Full_Body #container
{
	width:766px;
	background: #FFFFFF; /* the auto margins (in conjunction with a width) center the page */
	border: 0px solid #000000;
	text-align: center; /* this overrides the text-align: center on the body element. */
	margin-right: auto;
	margin-left: auto;
	padding-left:17px;
	padding-top:17px;
	padding-right:17px;
	padding-bottom:17px;

}

.Full_Body #header
{
	width:100%;
	padding-top:0px;
	padding-bottom:0px;
}

.Full_Body #menu
{
	clear:both;
	width:100%;
	height:43px;
	margin-left:-2px;
	/*vertical-align:bottom;*/
	background-color:#000000;
	background-image:url(images/menu_back.jpg);
		
}

.Full_Body #middle_information
{
	width:100%;
	float:left;
	background-color:#ffffff;
	position:relative;
	padding-top:0px;

} 
	
.Full_Body #middle_info_left
{
	width:35%;
	position:relative;
	float:left;
	padding-top: 20px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
}

.Full_Body #middle_info_rigth
{
	width:55%;
	position:relative;
	float:right;
	padding-right: 0px;
	padding-top:25px;
}

.Full_Body #middle_cols
{
	clear : both; 
	width:100%;
	background-color:#FECB63;
	height:200px;
	padding-top:5px;

 
}

.Full_Body #middle_cols_content01
{
	width:202px;
	height:190px;
	float:left;
	background-repeat:no-repeat;
	background-position:center;
	
}
.Full_Body #middle_cols_content02
{
	width:202px;
	height:190px;
	float:left;
	background-repeat:no-repeat;
	background-position:center;
	
}
.Full_Body #middle_cols_content03
{
	
	width:202px;
	height:190px;
	float:left;
	background-repeat:no-repeat;
	background-position:center;
	
}

.Full_Body #middle_col_footer
{
	clear : none;
	width:100%;
	background-color:#FECB63;
	padding-top: 15px;
	height:17px;
	float: right;

	
}
.Full_Body #middle_col_footer_image
{
	clear : both;
	width:100%;
	background-image:url(images/yellow-foot.jpg);
	height:39px;


}

.Full_Body  #contact_form
{
	width: 50%;
	float:left;
	background-color:#FFFFFF;
	font-family:Georgia;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	color:#5A5B5A;
	padding-left:20px;
}
.Full_Body  #contact_form1
{
	width: 30%;
	float:right;
	margin-right:10px;
	background-color:#FFFFFF;
	font-family:Georgia;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	color:#5A5B5A;
}


.Full_Body #footer
{
	clear : both;
	width:100%;
	background-color:#FF0000;
	/*padding: 0 10px; EBF5EC/* this padding matches the left alignment of the elements in the divs that appear above it. */
	padding-top:0px;
	height:104px;
}




.Text_Footer
{
	color:#475F4D;
	font-weight:bold;
	font-size:15px;
}

/* internal pages */
#bodytext
{
	width: 760px;
	padding:20px;
	font-family:Georgia;
	font-size: 14px;
	margin-left:auto;
	margin-right:auto;
	color:#5A5B5A;
	background-color:#FFFFFF;
	text-align:justify;
}
/* heading of internal pages */
.h1{
	font-family:Georgia;
	font-weight: bold;
	font-size: 18px;
	color: #475F4D;
}
.h2{
	font-family:Georgia;
	font-weight: bold;
	font-size: 14px;
	color: #475F4D;
}
.normaltext {
	font-family:Georgia;
	font-size: 14px;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	color:#5A5B5A;
}

Última edición por pegasomx; 18-mar-2008 a las 11:15.
pegasomx está desconectado   Responder Citando
Respuesta

No hay votos aún.


Herramientas
Desplegado

Normas de Publicación
No puedes crear nuevos temas
No puedes responder temas
No puedes subir archivos adjuntos
No puedes editar tus mensajes

BB code is Activado
Caritas están Activado
[IMG] está Activado
Código HTML está Desactivado


La Zona horaria es GMT -6. Ahora son las 09:40.


Message Board Statistics

LinkBacks Enabled by vBSEO 3.1.0

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93