d i x i n m o r t a l

GRÁFICOS + CÓDIGOS + ESCRITURA

StaffStaff  
  • ÍndiceÍndice  
  • ConectarseConectarse  
  • RegistrarseRegistrarse  
  • Últimas imágenesÚltimas imágenes  
    • Special Signature
    (52) El amor esta en el aire - Vesta
    ✎ ver tema
    Code Challenge
    (24) Oh Romeo... ━ Puck
    ✎ ver tema
    TUTO + CÓDIGO
    [CSS] Pseudoclase :Hasver tema
    TUTO + CÓDIGO
    Cambiar skin segun grupover tema
    TUTO + CÓDIGO
    Copiar Todo (Copy All)ver tema
    TUTO + CÓDIGO
    Contraseña en tablillasver tema
    TUTO + CODIGO
    Enlazar Tablillas de Afiliaciónver tema
    Últimos temas
    ¡Hola a todos!Ayer a las 4:09 amPuck
    #002 Libro de firmasJue Mayo 02, 2024 12:30 pmDuban Black
    Afiliación Pangea Ultima | ÉliteVie Abr 19, 2024 8:07 pmRoshio
    Runaterra RP [Afil. Élite] Vie Abr 19, 2024 8:06 pmRoshio
    Un fantasmita ha aparecido...Lun Mar 25, 2024 3:05 amMayhem
    Pokémon Vjola | Afiliación EliteMar Mar 19, 2024 2:57 amApolo
    Designspiration - Afiliación EliteMar Mar 19, 2024 2:56 amApolo
    Obscurum Cor - Afiliación Élite (Confirmación)Mar Mar 19, 2024 2:56 amApolo
    Buenas madrugadas~Lun Mar 04, 2024 12:02 pmYukari
    ¿Qué estás escuchando?Lun Feb 19, 2024 12:09 pmretrxrbit
    élites + hermanas
    Actualización: 27/09/2023
    nuestros ➹ directorios
    Agradecimiento especial al artista Faustine Dumontier por la ilustración de fondo que adorna el foro.
    Challenge Gráfico

    Próx

    Special Signature

    Bridgerton

    Pelea Gráfica

    Luz vs Oscuridad

    Challenge Código

    Paraíso Personal

    Challenge literario

    Amor y Amistad

    Evento

    Conejo de Pascua


    Ayuda con codigo de tabla

    d i x i n m o r t a l :: Usuarios :: Resueltas
    Comparte
    Ver el tema anteriorIr abajoVer el tema siguiente
    Anonymous
    Invitado
    Invitado
    PERMALINK
    Sáb Jul 30, 2016 4:10 pm
    Veran, he estado intentado hacer una tabla de afiliados al pie de mi foro, pero tengo problemas ; _ ;
    https://2img.net/h/oi64.tinypic.com/206d5km.jpg

    Como verán, la parte de los sitios hermanos, baja cada vez que agregó un segundo renglón a la parte de afiliados elite y quiero evitar eso :c Además ¿Alguien puede ayudarme como separar cada botón? De manera que no queden juntos ; _ ; Dejo el  html y el css a continuacion.

    HTML
    Código:
    <center>
    <table>
    <tbody>
    <tr>
    <td><div class="AfiliadosH">sitios hermanos</div></td>

        <td><div class="AfiliadosE">AFILIADOS ELITE</div></td>
      </tr>
    <tr>
      <td><div class="CajaHermanos">
        <a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a>
          <a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a>
            <a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a>
              <a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a></div></td>
      
      <td><div class="CajaElite">
        <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
              <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                    <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                          <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                      <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                            <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                                  <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                                        <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                                          <br>
                                                                <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                                                      <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                                                            <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                                                                  <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
                                                                                        <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
        </div></td>
      
      </tr>
    </tbody>
    </table>
              </center>

    CSS
    Código:
    .AfiliadosE {
        width: 600px;
        height: 30px;
        margin-right: 0px;
        border-bottom: 1px solid #46c5db;
        text-transform: uppercase;
        text-align: center;
        font-size: 30px;
        color: #46c5db;
    }
    .AfiliadosH {
        width: 500px;
        height: 30px;
        border-bottom: 1px solid #46c5db;
        text-transform: uppercase;
        text-align: center;
        font-size: 30px;
        color: #46c5db;
    }
    .CajaHermanos {
    width: 500px;
      height: auto;
      padding: 10px;
      display:block;
      text-align:center;
    }

    .CajaElite {
    width: 600px;
      height: auto;
      padding: 10px;
      display:block;
      text-align:center;
    }

    a.afiliadosh img {
    height: 50px ;
    width: 100px;
    border: 2px solid #46c5db;
    padding: 1px;
    }
    a.afiliadose img {
    height: 40px ;
    width: 40px;
    border: 2px solid #46c5db;
    text-align: center;
    padding: 1px;
    }

    Gracias de antemano al alma caritativa que pueda ayudar Ayuda con codigo de tabla 3736116548
    Roshio
    Roshio
    Webmaster
    PERMALINK
    Lun Ago 01, 2016 2:08 pm
    campo2 Mensajes :
    2489


    campo3 Blood :
    1306129


    campo4 Frasesita :
    Ｉ ｇｏ b o o m
    ᴅʏɴᴀᴍɪɢʜᴛ
    . . .
    Ayuda con codigo de tabla F0216a17-4a1a-4b5e-9b84-d699e8773f84-bakugou

    Ayuda con codigo de tabla B1

    Hola! Ya estuve revisando tu tabla y había algunas cosas que quizás resultan innecesarias como la tabla con doble fila, podrías simplemente hacer la tabla con 2 columnas en 1 fila, y en cada TD meter dos divs, uno para el titulo y otro para contener los botones. Tambien para que queden bien alineadas es importante usar los heights o los padding o los margin para mover los divs aumentando o disminuyendo los pixeles de altura.

    También para dar un espacio entre los botones que sea uniforme para todos, solo tienes que a la img agregarle un margin ;)

    Y bueno acá te dejo el CSS y HTML corregido, espero que te sirva. Me tomé la libertad de colocar un vínculo en forma de botoncito para tus afiliados normales y agregué una tipografía de Google Fonts que también puedes usar si quieres.

    Screenshot - http://prntscr.com/c0cbyw

    Código:
    <center>
    <table><tbody><tr>
    <td><center><div class="AfiliadosH">sitios hermanos</div>
    <div class="CajaHermanos">
    <a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a><a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a><a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a><a class="afiliadosh" href="/"><img src="http://placehold.it/100x50"></a></div>
    <a class="normales" href="/">AFILIADOS NORMALES</a></center>
    </td>

    <td><div class="AfiliadosE">AFILIADOS ELITE</div>
    <div class="CajaElite">
    <a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a><a class="afiliadose" href="/"><img src="http://placehold.it/35x35"></a>
    </div></td>
      
    </tr></tbody></table>
    </center>
    <link href='https://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>

    Código:
    .AfiliadosH {
        width: 220px;
        border-bottom: 1px solid #46c5db;
        text-transform: uppercase;
        text-align: center;
        font-size: 25px;
        color: #46c5db;
        padding:10px;
        display:block;
        font-family:Oswald;
    }
    .CajaHermanos {
      width: 220px;
      padding: 10px;
      display:block;
      text-align:center;
    }

    .AfiliadosE {
        width: 480px;
        margin-left: 10px;
        padding:13px 10px;
        border-bottom: 1px solid #46c5db;
        text-transform: uppercase;
        text-align: center;
        font-size: 25px;
        color: #46c5db;
        font-family:Oswald;
    }

    .CajaElite {
      width: 480px;
      height: auto;
      padding: 10px;
      display:block;
      text-align:center;
      margin-left: 10px;
    }

    a.afiliadosh img {
    height: 50px; width: 100px;
    border: 2px solid #46c5db;
    margin: 2px;
    }
    a.afiliadose img {
    height: 40px; width: 40px;
    border: 2px solid #46c5db;
    margin: 2px;
    }

    a.normales {
    display:block;
    background:#46c5db;
    color:#fff;
    font-family: Oswald;
    font-size:10px;
    letter-spacing:3px;
    text-align:center;
    width:190px;
    padding:10px;
    margin-top:-10px;
    text-decoration: none;
    }
    campo2 Mensajes :
    2489


    campo3 Blood :
    1306129


    campo4 Frasesita :
    Ｉ ｇｏ b o o m
    ᴅʏɴᴀᴍɪɢʜᴛ
    . . .
    Ayuda con codigo de tabla F0216a17-4a1a-4b5e-9b84-d699e8773f84-bakugou

    Ayuda con codigo de tabla B1

    Hey, hi, hello!
    Estamos encantados de conocerte. (:
    Cinnamon roll
    Too good for this world, too pure
    ¡Nueve años!
    Nueve años junto a nosotros ♥
    Mano amiga
    Has resuelto la duda de otro usuario ♥
    Ayudante destacado
    Has sugerido y ha sido implementado.
    Ojo de águila
    Detectaste un error. >: |
    ¡Dix love!
    ¡Amamos Dix Inmortal!
    ¡Spammer!
    Participante asiduo de la zona spam
    Orador
    Participante de la zona de debates
    Orador proclamado
    ¡Has creado o participado en al menos 10 debates!
    Community Manager
    Has invitado a un amigo al foro
    Social butterfly
    Has invitado a más de 5 amigos al foro
    Community Manager A Tier
    ¡Soy coder!
    Has abierto tu galería de códigos.
    Soy maestro
    Has subido un tutorial en la zona de códigos
    Soporte al coder
    Has resuelto una duda en la zona de códigos
    ¡Estoy aprendiendo!
    Has participado activamente en al menos 5 tutoriales
    ¡Soy designer!
    Has abierto tu galería
    Soy maestro
    Has subido un tutorial en la zona gráfica
    Soporte al designer
    Has resuelto una duda en la zona gráfica
    ¡Estoy aprendiendo!
    Has participado activamente en al menos 5 tutoriales
    ¡Aportando!
    Has subido al menos 3 recursos en la zona gráfica
    ¡Soy Escritor!
    Subiste un fanfic o escrito propio
    Soy maestro
    Has subido un tutorial en la zona de escritura
    1000 mensajes publicados
    ¡Eres todo un dixiano!
    ¡Aportando!
    Has subido 3 aportes a la zona códigos
    Jarro de Caramelos
    Participaste del evento 2023
    ¡Encontrando fantasmas!
    Participaste del evento 2023
    ¡Encuentra las Galletas!
    Participaste en el evento 2023
    Raspadito Navideño
    Participaste en el evento 2023
    Conejo de Pascua
    Mini evento 2024
    Anonymous
    Invitado
    Invitado
    PERMALINK
    Lun Ago 01, 2016 11:40 pm
    ¡Gracias, Roshiooo! ; // ;
    ¡Muchisimas gracias, eres la mejor! ¡Quedo perfecto! ¡Ya tenia la duda con las tablas! Hahaha <3<3

    ¡Graciaaas! <3
    Roshio
    Roshio
    Webmaster
    PERMALINK
    Mar Ago 02, 2016 12:40 pm
    campo2 Mensajes :
    2489


    campo3 Blood :
    1306129


    campo4 Frasesita :
    Ｉ ｇｏ b o o m
    ᴅʏɴᴀᴍɪɢʜᴛ
    . . .
    Ayuda con codigo de tabla F0216a17-4a1a-4b5e-9b84-d699e8773f84-bakugou

    Ayuda con codigo de tabla B1

    Wii me alegro mucho que te sirviera Ayuda con codigo de tabla 1038737265 cualquier otra cosita me dices!!










    campo2 Mensajes :
    2489


    campo3 Blood :
    1306129


    campo4 Frasesita :
    Ｉ ｇｏ b o o m
    ᴅʏɴᴀᴍɪɢʜᴛ
    . . .
    Ayuda con codigo de tabla F0216a17-4a1a-4b5e-9b84-d699e8773f84-bakugou

    Ayuda con codigo de tabla B1

    Hey, hi, hello!
    Estamos encantados de conocerte. (:
    Cinnamon roll
    Too good for this world, too pure
    ¡Nueve años!
    Nueve años junto a nosotros ♥
    Mano amiga
    Has resuelto la duda de otro usuario ♥
    Ayudante destacado
    Has sugerido y ha sido implementado.
    Ojo de águila
    Detectaste un error. >: |
    ¡Dix love!
    ¡Amamos Dix Inmortal!
    ¡Spammer!
    Participante asiduo de la zona spam
    Orador
    Participante de la zona de debates
    Orador proclamado
    ¡Has creado o participado en al menos 10 debates!
    Community Manager
    Has invitado a un amigo al foro
    Social butterfly
    Has invitado a más de 5 amigos al foro
    Community Manager A Tier
    ¡Soy coder!
    Has abierto tu galería de códigos.
    Soy maestro
    Has subido un tutorial en la zona de códigos
    Soporte al coder
    Has resuelto una duda en la zona de códigos
    ¡Estoy aprendiendo!
    Has participado activamente en al menos 5 tutoriales
    ¡Soy designer!
    Has abierto tu galería
    Soy maestro
    Has subido un tutorial en la zona gráfica
    Soporte al designer
    Has resuelto una duda en la zona gráfica
    ¡Estoy aprendiendo!
    Has participado activamente en al menos 5 tutoriales
    ¡Aportando!
    Has subido al menos 3 recursos en la zona gráfica
    ¡Soy Escritor!
    Subiste un fanfic o escrito propio
    Soy maestro
    Has subido un tutorial en la zona de escritura
    1000 mensajes publicados
    ¡Eres todo un dixiano!
    ¡Aportando!
    Has subido 3 aportes a la zona códigos
    Jarro de Caramelos
    Participaste del evento 2023
    ¡Encontrando fantasmas!
    Participaste del evento 2023
    ¡Encuentra las Galletas!
    Participaste en el evento 2023
    Raspadito Navideño
    Participaste en el evento 2023
    Conejo de Pascua
    Mini evento 2024
    Contenido patrocinado
    PERMALINK
    Ver el tema anteriorVolver arribaVer el tema siguiente
    Permisos de este foro:
    No puedes responder a temas en este foro.
    Copyrighted.com Registered & Protected