Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
1
respuesta

[Duda] De nuevo no me lee el padding ... ayuda

En el ultimo ejercicio de la tabla, el padding no me lo lee por lo que aparece pegada al boton enviar y los margenes de la tabla no se marcan en negrito, se ven claros. Fui siguiendo el codigo con el video y ya lo cheque varias veces y no encuentro el error :c ayuda. Comparto el codigo solamente de la tabla porque hay un limite de caracteres.

            </form>

            <table>
                <thead>
                    <tr>
                        <th>Dias</td>
                        <th>Horario</td>
                    </tr>
                </thead>

                <tbody>
                    <tr>
                        <td>Lunes</td>
                        <td>08h ~ 20h</td>
                    </tr>
                    <tr>
                        <td>Miercoles</td>
                        <td>08h ~ 20h</td>
                    </tr>
                    <tr>
                        <td>Viernes</td>
                        <td>08h ~ 20h</td>
                    </tr>
                </tbody>
            </table>



        </main>

        <footer>
            <img src="imagenes\logo-blanco.png" alt="Logo de la barberia alura">
            <p class="copyright">&copy Copyright Barberia Alura 2023 hecha por Daniel Reyes Vivar</p>
        </footer>
    </body>
    </html>

Aqui esta el CSS

header {
    background: #BBBBBB;
    padding: 20px 0;
}

.caja{
    width: 940px;
    position: relative;
    margin: 0 auto;
}

nav{
    position: absolute;
    top: 110px;
    right: 0px;
}

nav li{
    display: inline;
    margin: 0 0 0 15px;
}

nav a{
    text-transform: uppercase;
    color: #000000;
    font-weight: bold;
    font-size: 22px;
    text-decoration: none;
}

nav a:hover{
    color: #c78c19;
    text-decoration: underline;
}


.productos{
    width: 940px;
    margin: 0 auto;
    padding: 50px;
}

.productos li{
    display: inline-block;
    text-align: center;
    width: 30%;
    vertical-align: top;
    margin: 0 1.5%;
    padding: 30px 20px;
    box-sizing: border-box;
    border: 2px solid #000000;
    border-radius: 10px;
}

.productos li:hover{
    border-color: #c78c19;
}

.productos li:active{
    border-color: #088c19;
}

.productos h2{
    font-size: 30px;
    font-weight: bold;
}

.productos li:hover h2{
    font-size: 33px;
}

.producto-descripcion{
    font-size: 18px;
}

.producto-precio{
    font-size: 20px;
    font-weight: bold;
    margin-top: 10px;
}

footer{
    text-align: center;
    background: url(bg.jpg);
    padding: 40px;
}

.copyright{
    color: #FFFFFF;
    font-size: 13px;
    margin: 20px;
}

main{
    width: 940px;
    margin: 0 auto;
}

form{
    margin: 40px 0;
}

form label, form legend{
    display: block;
    font-size: 20px;
    margin: 0 0 10px;
}

.input-padron{
    display: block;
    margin: 0 0 20px;
    padding: 10px 25px;
    width: 50%;
}

.checkbox{
    margin: 20px 0;    
}

.enviar{
    width: 40%;
    padding: 15px 0;
    font-size: 18px;
    font-weight: bold;
    color: #FFFFFF;
    background: orange;
    border: none;
    border-radius: 5px;
    transition: 1s all;
    cursor: pointer;
}

.enviar:hover{
    background: darkorange;
    transform: scale(1.2);
}

table {
    margin: 40px 40px;
}

thead {
    background: #555555;
    color: white;
    font-weight: bold;
}

td, th {
    border: 1px solid #000000;
    padding: 8px 15px;
}
1 respuesta
solución!

¡Hola Danielreyesvivar!

Por lo que puedo ver en el código que compartiste, el problema puede estar en que no estás aplicando el estilo de padding a la tabla en sí, sino que lo estás aplicando a los elementos internos de la tabla (td, th). Para solucionarlo, te sugiero que agregues el siguiente estilo a tu hoja de estilos CSS:

table {
  padding: 20px;
}

Con respecto a los márgenes de la tabla, no veo en tu código que hayas aplicado ningún estilo para que se muestren en negrita. Si quieres que los márgenes de la tabla se vean en negrita, puedes agregar el siguiente estilo:

table {
  margin: 40px 40px;
  font-weight: bold;
}

Espero que esto te ayude a solucionar tu problema. ¡Buenos estudios!

Si este post te ayudó, por favor, marca como solucionado ✓. Continúa con tus estudios! :)