dragster2020 escribió:Hola
Hace algo de tiempo puse un tema en el foro buscando un poco de ayuda para que me pudiesen ayudar con un error d una pagina que estoy tratando de hacer pero sin mucha suerte, el asunto del tema donde solicito ayuda es busco un poco de ayuda, espero me puedan ayudar gracias
Hola:
Creo que en su spot anterior usted puso estos códigos
/* Layout elements */
/* Fundamentals */
html {
background: #222 url(../images/bg.gif) repeat-x scroll;
font: 0.75em/1.3 Verdana, Helvetica, Arial, Sans-serif;
text-align: justify;
}
/* Body container */
body {
font-size: 15 cm;
margin: 0 auto ;
padding: 0 auto ;
text-align: justify;
width: 955px;
background: #fff url(../images/mainbg.gif) repeat-y;
border-left: 1px solid #000;
border-right: 1px solid #000;
}
/* Links */
a:link, a:visited {
color: #b55555;
text-decoration: underline;
}
a:hover,a:active {
color: #386084;
text-decoration: underline;
}
/* Headings */
h2 {
font: normal 1.6em "Century Gothic", Geneva, Helvetica, Arial, Sans-serif;
}
h3 {
font: normal 1.5em "Century Gothic", Geneva, Helvetica, Arial, Sans-serif;
}
h4 {color:red;
font: normal 1.1em "Century Gothic", Geneva, Helvetica, Arial, Sans-serif; margin-top:10px ; margin-bottom:0px ;
margin-left:30px ; margin-right:0px
}
h5 {color:red;
font: normal 1.5em "Century Gothic", Geneva, Helvetica, Arial, Sans-serif;
}
h6 {color:blue;font:normal 0.7;text-align: right }
/* Lists */
ul {
margin-left: 25px;
padding: 0;
}
li {
list-style-type: square;
}
/* Layout IDs */
/* Header */
#head {
width: 955px;
height: 150px;
}
#head h1 {
margin: 0;
padding: 0;
display: block;
width: 955px;
height: 151px;
background-image: url(../images/head.jpg);
text-indent: -10000px;
}
/* Navigation */
#nav {
margin: 0;
padding: 0;
width: 955px;
height: 31px;
}
/* Navigation list */
#nav ul {
margin: 0 0 0 13px;
padding: 0;
}
#nav li {
float: left;
list-style: none none;
font-size: 0.7em;
margin: 0 0 0 2px;
padding: 3px 0;
text-transform: uppercase;
}
/* Navigation links */
#nav li a:link, #nav li a:visited {
margin: 0;
padding: 3px 0;
display: block;
width: 183px;
color: #222;
background-color: #f3f3f3;
text-decoration: none;
text-align: center;
}
#nav li a:hover, #nav li a:active {
margin: 0;
padding: 3px 0;
display: block;
width: 110px;
color: #111;
background-color: #fefefe;
text-decoration: none;
}
/* Span to change colour */
#nav li a:link span, #nav li a:visited span {
margin: 0;
padding: 0;
color: #5588b5;
text-decoration: none;
}
#nav li a:hover span, #nav li a:active span {
margin: 0;
padding: 0;
color: #5588b5;
text-decoration: none;
}
/* Main content */
#main {
width: 680px;
padding: 15px;
float: left;
}
/* Sidebar */
#sidebar {
width: 190px;
padding: 15px;
float: right;
}
/* Sidebar list links */
#sidebar ul {
margin: 0;
padding: 0;
}
#sidebar li {
margin: 3px 0 0 0;
padding: 0;
list-style-type: none;
}
#sidebar li a:link, #sidebar li a:visited {
display: block;
width: 180px;
padding: 2px 0 2px 5px;
background-color: #f1f1f1;
color: #333;
text-decoration: none;
}
#sidebar li a:hover, #sidebar li a:active {
display: block;
width: 180px;
padding: 2px 0 2px 5px;
background-color: #fcfcfc;
color: #222;
text-decoration: none;
}
/* Footer */
#foot {
margin: 0;
padding: 0;
text-align: center;
clear: both;
}
#foot p {
margin: 0;
padding: 20px 0;
font-weight: bold;
}
y este es el html
<html xmlns="
http://www.protekt.com.mx" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Protekt</title>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<meta name="keywords" content="Site keywords here" />
<meta name="description" content="Site description here" />
<meta name="author" content="Your name here" />
<link rel="stylesheet" type="text/css" href="css/style.css" />
</head>
<body>
<div id="head">
<h1>POTEKT.COM.MX</h1>
</div>
<div id="nav">
<ul>
<span>LINK</span>
<span>LINK</span>
<span>LINK</span>
<span>LINK</span>
<span>LINK</span>
</div>
<div id="main">
[contenido no disponible]
<h5>Sitio aun en construccion.</h5>
<h5>Gracias por su comprención.</h5>
</div>
<div id="sidebar">
<ul>
LINK
LINK
LINK
LINK
</div>
<div id="foot">
bla bla bla bla </a></p>
</div>
</body>
</html>
Pero en este sector que le pongo ahora, si usted se fija puso dos medidas diferentes:
#nav li a:link, #nav li a:visited {
margin: 0;
padding: 3px 0;
display: block;
width: 183px; Acá puso 183 píxeles
color: #222;
background-color: #f3f3f3;
text-decoration: none;
text-align: center;
}
#nav li a:hover, #nav li a:active {
margin: 0;
padding: 3px 0;
display: block;
width: 110px; Y acá puso usted 110 píxeles. Creo debe ser 183
color: #111;
background-color: #fefefe;
text-decoration: none;
}
Creo que sin necesidad de modificar nada de lo demás, lo que debiera de hacer es eliminar esos 110 píxeles y ponerle 183 píxeles para que coincidan las medidas.
Espero esto le solucione
saludos
Sugerencia aparte: Debe de tener cuidado cuando utiliza layout, ya que en teoría se les conoce por ser muy estables, pero también tienen sus problemillas