Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Problema con un div que agrego a mi web

Estas en el tema de Problema con un div que agrego a mi web en el foro de CSS en Foros del Web. Hola a todos. Estoy teniendo un problema que no he podido resolver. Estoy creando una web y al momento me iba todo bien. Cuando agregue ...
  #1 (permalink)  
Antiguo 03/12/2014, 09:38
 
Fecha de Ingreso: noviembre-2014
Ubicación: uruguay
Mensajes: 6
Antigüedad: 9 años, 3 meses
Puntos: 0
Pregunta Problema con un div que agrego a mi web

Hola a todos.
Estoy teniendo un problema que no he podido resolver.

Estoy creando una web y al momento me iba todo bien.

Cuando agregue el div 1 es cuando empezó el problema.
Me queda todo encimado y ya he tratado miles de cosas pero no se dar con el problema.
la url para que puedan ver el problema es www.plazahosting.com.uy/2
tendría que quedar los 4 rectángulos, después el banner y después los otros 4 rectángulos mas.
mi código es este:

<div id="contenedor">
<div id="cabezera">


</div>
<div id="contenido">




<div id="wrapper">
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">

</div>
</div>

</div>






<div id="planes">
<div id="diseno-texto">
<div id="planes2">
<div id="imagen-planes"></div>
<div id="diseno-titulo"></div>
<div id="diseno-texto2">

</div>
</div>
<p>&nbsp;</p>
</div>
</div>


<div id="1">

<div id="img1">


</div>


<div id="img2">


</div>


<div id="img3">


</div>

<div id="img4">

</div>



</div>



<div id="propaganda"></div>


<div id="nada">

<div id="contacto">


</div>


<div id="respaldo">


</div>


<div id="seo">



</div>

<div id="seguridad">


</div>



</div>


<div id="face">



</div>

</div>

y mi css es este:

@charset "utf-8";
/* CSS Document */


html,body{
height:100%; width:100%;
}
#contenedor{
display:table;
width:100%;
min-height: 100%;
height: auto !important;
height: 100%;
margin: auto;
position:relative;
}


#cabezera {
width:100%;
background-image:url(../images/back.png)
}
#logo {width:28%; height:auto; margin-left:35%;}

#facebookcabeza{ position:absolute; width:auto; height:auto; margin-top:-28px; right:2%;}


#botonera {width:560px; height:55px; margin:auto; margin-top:5px; }


/* empieza estilos del menu */
#nav,#nav ul {
font-family:verdana;
list-style:none;
margin:0;
padding:0;
position:relative;
}
#nav {
height:50px;
left:0;
overflow:hidden;
top:0;
}
#nav li {
float:left;
position:relative;
z-index:10;
}
#nav li a {
background:url(../images2/bg-menu.png) no-repeat center top;
color:#fff;
display:block;
float:left;
font-size:14px;
height:51px;
line-height:40px;
padding:0 10px;
position:relative;
text-decoration:none;
z-index:20;
}
#nav li:first-child a {
background:url(../images2/bg-menu.png) no-repeat left top;
padding-left:35px;
}
#nav li ul li:first-child a {
background-image:none;
padding-left:10px;
}
#nav li.pad {
background:url(../images2/bg-menu.png) no-repeat right top;
display:block;
height:51px;
width:35px;
}
#nav ul {
background:#333;
height:auto;
padding:10px 0;
position:absolute;
top:-115px;
width:180px;
z-index:1;

border-radius:8px; /*some css3*/
-moz-border-radius:8px;
-webkit-border-radius:8px;
transition:0.8s ease-in-out;
box-shadow:2px 2px 3px rgba(0, 0, 0, 0.5);
-moz-box-shadow:2px 2px 3px rgba(0, 0, 0, 0.5);
-webkit-box-shadow:2px 2px 3px rgba(0, 0, 0, 0.5);
-moz-transition:0.8s ease-in-out;
-o-transition:0.8s ease-in-out;
-webkit-transition:all 0.8s ease-in-out;
}
#nav ul li {
width:180px;
}
#nav ul li a {
background:transparent;
height:20px;
line-height:20px;
width:160px;
}
#nav:hover {
height:200px;
}
#nav li:hover ul {
-moz-transform:translate(0,161px); /*some css3*/
-o-transform:translate(0,161px);
-webkit-transform:translate(0,161px);
}
#nav a:hover,#nav li:hover > a {
color:#CCC;
}


/* empieza propaganda de diseño web de la pagina principal*/

#planes {width:92%; margin:auto; margin-top:5px; position:relative;}

#imagen-planes {
width: 350px; position:relative;
float: right;
padding-top:5px;
}

#diseno-titulo {
font-family: Arial, Helvetica, sans-serif;
font-size: 24px;
width: 550px;
color: #313131;
font-weight: bold;
padding-top: 5px; margin-top:5px; text-decoration:underline; margin-left:15px;
}

#diseno-texto {
font-weight: normal;
font-size: 12px;
width: auto;
margin-left:15px; padding-top:4px;
font-family: Sans-serif;
color: #666; position:relative;
}






#1 { width:90%; }
.imagen_contacto { width:40%; position: relative; margin-left:1%; padding-top:1%; margin-top:3%; margin-left:32%; }
.text1contacto {
font-weight: normal;
font-size: 12px;
width:98%;
font-family: Sans-serif;
position:absolute;
text-align: center;
top: 96px;
height: 284px; color:#FFF;
}

#img1 {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:40px;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}


#img2 {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:27%;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}


#img3 {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:52%;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}

#img4 {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:76%;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}

#propaganda { height:200px;width:99%; margin-top:80px; background-image:url(../images/banner/1.png); background-repeat:no-repeat; background-position:center; }
/* termina propaganda de diseño web de la pagina principal*/

#nada { width:90%; }


.imagen_contacto { width:40%; position: relative; margin-left:1%; padding-top:1%; margin-top:3%; margin-left:32%; }
.text1contacto {
font-weight: normal;
font-size: 12px;
width:98%;
font-family: Sans-serif;
position:absolute;
text-align: center;
top: 96px;
height: 284px; color:#FFF;
}
#contacto {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:40px;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}

#respaldo {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:27%;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}

#seo {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:52%;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}

#seguridad {
width:18%;
margin-top:5px;
border: 1px #063 solid;
position:absolute;
margin-left:76%;
background-image:url(../images/1.png);
background-repeat:no-repeat;
height: 271px; border-top-left-radius:15px;

border-top-right-radius:0;

border-bottom-right-radius:15px;

border-bottom-left-radius:0; box-shadow: 15px 5px 10px #aaa;
border-radius: 10px;

/*border-radius: : 15px 0 15px 0;*/

}









#push{
height:29px;
}

#footer{
width: 100%;

position:fixed;

height: 80px;

text-align: left;

padding: 4px 0px;

background: #1d1d1d;

font-family: "century gothic","arial";

color: #F7F2EF;

font-size: 10px;

bottom:0px;

z-index:3;
}

.marcas { font-family:"Arial Black",
font-size: 18px; height:50px; margin-left:250px;
color: #FFF; width:80%; font-weight: bold;
}

.copyright { font-family:"Arial Black",
font-size: 10px;
width:82%;
color: #FFF; padding-left:2%; margin-top:1%;
font-size: 12px;}

#face { margin-top:290px; margin-left:18%; margin-right:28%; position:absolute; float:left;}

la url para que puedan ver el problema es www.plazahosting.com.uy/2

Tendrían que quedar los 4 rectángulos de arriba, después el banner y después otros 4 rectángulos.

Desde ya agradezco a quien me pueda dar una manito.
  #2 (permalink)  
Antiguo 03/12/2014, 10:37
Avatar de lauser
Moderator Unix/Linux
 
Fecha de Ingreso: julio-2013
Ubicación: Odessa (Ukrania)
Mensajes: 3.278
Antigüedad: 10 años, 7 meses
Puntos: 401
Respuesta: Problema con un div que agrego a mi web

Aparte de que a simple vista están desordenados.... puedes colocarlo todo en Highlight, asi nos aclararemos mejor y no hará daño a los ojos.
__________________
Los usuarios que te responden, lo hacen altruistamente y sin ánimo de lucro con el único fin de ayudarte. Se paciente y agradecido.
-SOLOLINUX-
  #3 (permalink)  
Antiguo 06/12/2014, 06:10
 
Fecha de Ingreso: noviembre-2014
Ubicación: uruguay
Mensajes: 6
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: Problema con un div que agrego a mi web

Hola, gracias por responder, disculpa, que es highlight? gracias

Última edición por Trader_82; 06/12/2014 a las 06:15
  #4 (permalink)  
Antiguo 06/12/2014, 06:16
 
Fecha de Ingreso: noviembre-2014
Ubicación: uruguay
Mensajes: 6
Antigüedad: 9 años, 3 meses
Puntos: 0
Respuesta: Problema con un div que agrego a mi web

Hola, gracias por responder, disculpa, que es highlight? gracias
  #5 (permalink)  
Antiguo 06/12/2014, 14:40
Avatar de lauser
Moderator Unix/Linux
 
Fecha de Ingreso: julio-2013
Ubicación: Odessa (Ukrania)
Mensajes: 3.278
Antigüedad: 10 años, 7 meses
Puntos: 401
Respuesta: Problema con un div que agrego a mi web

Cita:
Iniciado por Trader_82 Ver Mensaje
Hola, gracias por responder, disculpa, que es highlight? gracias
En la ventana de responder,,, mira en la derecha. Selecciona tu tipo de lenguaje y lo pegas, de esta forma quedara legible, tal como lo ves tu en tu editor.
__________________
Los usuarios que te responden, lo hacen altruistamente y sin ánimo de lucro con el único fin de ayudarte. Se paciente y agradecido.
-SOLOLINUX-
  #6 (permalink)  
Antiguo 06/12/2014, 18:09
Avatar de herzbazi  
Fecha de Ingreso: febrero-2012
Mensajes: 612
Antigüedad: 12 años
Puntos: 36
Pregunta Respuesta: Problema con un div que agrego a mi web

bueno primero que nada para que te podamos ayudar escribe nuevamente el codigo con el Highlight luego de eso ya veremos con gusto te apoyamos
__________________
Enseña todo lo que sepas...
Aprende todo lo que puedas..

Etiquetas: divs, html, programacion
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 20:05.