+ Responder Tema
Resultados 1 al 7 de 7

Tema: como poner capas una a lado de la otra?

  1. #1
    Recien Llegado! Habitual kero92 Está en el buen camino
    Fecha de Ingreso
    21 jun, 08
    Mensajes
    13
    Poder de Reputación
    6

    como poner capas una a lado de la otra?

    pues quiero poner tres capas para que aparescan una l lado de la otra pero
    siempre que lo intento, estas se ponen una sobre otra, como lo arreglo?

  2. #2
    Esto empieza a ser un vicio... Habitante Raulyure Está en el buen camino
    Fecha de Ingreso
    16 feb, 08
    Ubicación
    Estella-Spain
    Mensajes
    2,249
    Poder de Reputación
    18

    Re: como poner capas una a lado de la otra?

    Cita Iniciado por kero92
    pues quiero poner tres capas para que aparescan una l lado de la otra pero
    siempre que lo intento, estas se ponen una sobre otra, como lo arreglo?
    Hola:
    Haga una capa donde puedan caber esas tres y las mete dentro y le pone un float:left a cada una de las tres, y si la capa que va a contener a esas tres capas lleva bordes a la izquierda y a la derecha , hágala un par de píxeles mas ancha que la suma de las tres capas
    saludos
    Agradecido de los que aprenden enseñando

  3. #3
    Recien Llegado! Habitual kero92 Está en el buen camino
    Fecha de Ingreso
    21 jun, 08
    Mensajes
    13
    Poder de Reputación
    6
    ya tengo hecho así, pero cuando restauro el navegador y la ventana se hace mas paqueña, las capas se desalinean

  4. #4
    Esto empieza a ser un vicio... Habitante Raulyure Está en el buen camino
    Fecha de Ingreso
    16 feb, 08
    Ubicación
    Estella-Spain
    Mensajes
    2,249
    Poder de Reputación
    18
    Cita Iniciado por kero92
    ya tengo hecho así, pero cuando restauro el navegador y la ventana se hace mas paqueña, las capas se desalinean
    Hola:
    Entonces si no le molesta tendría que ponernos los códigos de la página en que están esas capas y los códigos de la hoja de estilo, para que podamos visualizar mejor el problema y poder solucionarlo.
    Saludos
    Agradecido de los que aprenden enseñando

  5. #5
    Recien Llegado! Habitual kero92 Está en el buen camino
    Fecha de Ingreso
    21 jun, 08
    Mensajes
    13
    Poder de Reputación
    6
    Codigos HTML:


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Pagina Principal del Ejemplo CCTW</title>
    <link rel="stylesheet" href="estilos.css" type="text/css" media="all" >
    <META content="Los mejores Animes, Series y Películas a tu alcanze" name="description">
    <META content="peliculas, películas, anime, Ecuador, venta, series, Lost, Heroes" name="keywords">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


    </head>
    <div id="cabecera">
    <div id="logo"></div>

    </div></div>
    <div id="menu">
    <ul>
    [*]Inicio
    [*]Películas
    [*]Series
    [*]Musicales
    [*]Animes
    [*]Wii
    [*]SiteMap
    [*]Contáctenos
    </div>
    <div id"cuerpo">
    <div id="izquierda">hah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha ha </div>
    <div id="contenido">ahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha ha</div>
    <div id="derecha">a</div>
    </div>
    <div id="pie"></div>


    </body>
    </html>


    Codigod CSS



    *{margin:0px;padding:0px;border:0px;text-align:center;list-style: none; text-align: justify}
    #cabecera {float:top;width:100%; height:100px;background-color:pink}
    #logo{float: left;width:520px; background-color: red; background-image: url(objetos/logotipo.png); height:80px;margin: 10px}
    #publicidadcabeza{height: 80px;float: left;width:50%px; background-color: pink}
    #menu{width:1280px;height:25px;background-color:blue}
    #cuerpo{text-align: left}
    #izquierda{float:left; text-align: left;width: 150px;background-color:yellow;margin:15px 10px 15px 10px}
    #contenido{float:left; width: 600px ; text-align: left;background-color:red;margin:15px 5px 15px 5px}
    #derecha { float:left;width: 150px;background-color:green;text-align: left;margin:15px 7px 15px 10px}
    #pie{ float: left;width:100%; height: 20px;background-color: violet}
    #menu{border: black 1px solid;background-image: url(objetos/fondo-menus.gif);font-size: 15px;font-weight:bold;height: 35px; ;display: block }
    #menu li{font-size: 15px; float:left;text-align: left;font-size: 15px; margin: 0px 30px 0px 30px ; font-weight:bold}
    #menu a{font-size: 15px;display: block;color:#EEAD0E;text-decoration:none; font-weight:bold;background-image:white}
    #menu a:link{color:black}
    #menu a:visited{color:black}
    #menu a:hover{color: #90EE90; background-color:silver}
    #menu a:active{color: green}
    #menu ul{margin: 5px 0px 0px 30px}

  6. #6
    Esto empieza a ser un vicio... Habitante Raulyure Está en el buen camino
    Fecha de Ingreso
    16 feb, 08
    Ubicación
    Estella-Spain
    Mensajes
    2,249
    Poder de Reputación
    18
    Cita Iniciado por kero92
    Codigos HTML:


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

    <html>
    <head>
    <title>Pagina Principal del Ejemplo CCTW</title>
    <link rel="stylesheet" href="estilos.css" type="text/css" media="all" >
    <META content="Los mejores Animes, Series y Películas a tu alcanze" name="description">
    <META content="peliculas, películas, anime, Ecuador, venta, series, Lost, Heroes" name="keywords">
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


    </head>
    <div id="cabecera">
    <div id="logo"></div>

    </div></div>
    <div id="menu">
    <ul>
    [*]Inicio
    [*]Películas
    [*]Series
    [*]Musicales
    [*]Animes
    [*]Wii
    [*]SiteMap
    [*]Contáctenos
    </div>
    <div id"cuerpo">
    <div id="izquierda">hah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha ha </div>
    <div id="contenido">ahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha hahah h aha ha hah ha h hha ha h ha hha ha h ahha hahhah aha hha h ah ahha ha ha hh aahha ha hhha ha</div>
    <div id="derecha">a</div>
    </div>
    <div id="pie"></div>


    </body>
    </html>


    Codigod CSS



    *{margin:0px;padding:0px;border:0px;text-align:center;list-style: none; text-align: justify}
    #cabecera {float:top;width:100%; height:100px;background-color:pink}
    #logo{float: left;width:520px; background-color: red; background-image: url(objetos/logotipo.png); height:80px;margin: 10px}
    #publicidadcabeza{height: 80px;float: left;width:50%px; background-color: pink}
    #menu{width:1280px;height:25px;background-color:blue}
    #cuerpo{text-align: left}
    #izquierda{float:left; text-align: left;width: 150px;background-color:yellow;margin:15px 10px 15px 10px}
    #contenido{float:left; width: 600px ; text-align: left;background-color:red;margin:15px 5px 15px 5px}
    #derecha { float:left;width: 150px;background-color:green;text-align: left;margin:15px 7px 15px 10px}
    #pie{ float: left;width:100%; height: 20px;background-color: violet}
    #menu{border: black 1px solid;background-image: url(objetos/fondo-menus.gif);font-size: 15px;font-weight:bold;height: 35px; ;display: block }
    #menu li{font-size: 15px; float:left;text-align: left;font-size: 15px; margin: 0px 30px 0px 30px ; font-weight:bold}
    #menu a{font-size: 15px;display: block;color:#EEAD0E;text-decoration:none; font-weight:bold;background-image:white}
    #menu a:link{color:black}
    #menu a:visited{color:black}
    #menu a:hover{color: #90EE90; background-color:silver}
    #menu a:active{color: green}
    #menu ul{margin: 5px 0px 0px 30px}
    Hola:
    creo que a continuación de la capa <div id="logo">usted la cierra con un </div> y estaría correcto pero es que después usted cierra la capa cabecera con otro </div> que también estaría correcto, el problema es que vuelve usted a poner a continuación otro </div> y yo diría que ese estaría sobrando, fuera de eso por lo que usted a puesto acá en el spot le falta poner <body> abajo de donde dice </head> eso sería en su página. En su hoja de estilo usted en el grupo de los enlaces (el grupo de las a) arriba de donde tiene puesto #menu a:link{color:black} le falta poner una a que va sola : a{}, cada vez que haga un grupo de enlaces con las a debe ocupar las cinco.
    También es posible que esté erróneo lo que usted ha puesto en su hoja de estilo en la primera línea, la del asterisco, usted tiene puesto text-align:center y mas adelante tiene puesto text-align:justify
    Usted debiera de tenerlo así:
    *{text-indent:0px;margin:0px;padding:0px;border:0px;} y en la segunda línea poner
    body{text-align:center;}
    y después lo demás y ya veremos como se va arreglándo poco a poco
    Saludos
    Agradecido de los que aprenden enseñando

  7. #7
    Recien Llegado! Habitual kero92 Está en el buen camino
    Fecha de Ingreso
    21 jun, 08
    Mensajes
    13
    Poder de Reputación
    6
    muchas gracias amigo, en realidad no me había percatado de esos errores, pero me sigue dando el error de que cuando le restauro al navegador y le cambio de tamaño a uno mas pequeño, los divs se descuadran, si alguien supiera como arreglar esto apreciaría mucho su ayuda

+ Responder Tema

Temas Similares

  1. LAS CAPAS NO SE ME PONEN UNA AL LADO DE OTRA.
    Por Kangui en el foro Foro General
    Respuestas: 1
    Último Mensaje: 14/02/2010, 10:45
  2. como poner una imagen al lado de otra
    Por kuachimu en el foro Otros Elementos
    Respuestas: 4
    Último Mensaje: 01/12/2009, 09:19

Permisos de Publicación

  • No puedes crear nuevos temas
  • No puedes responder temas
  • No puedes subir archivos adjuntos
  • No puedes editar tus mensajes