Foros Programación Cliente

Ayuda con padding o margin por favor.

4 4 Respuestas Jueves 7 de junio, 2012
Hola quiero reducir el margen blanco entre el texto y su propia caja. Con padding 0 y margin 0 no entiendo porque sigue manteniendo un margen.

¿Podéis ayudarme?, ¡ya no se que hacer!

Os dejo el código que he hecho yo:



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">;
<html xmlns="http://www.w3.org/1999/xhtml">;
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Documento sin título</title>

<style type="text/css">

body{padding:0px; margin:0px;}

.derecha {
text-align: left;
padding:0px;
margin:0px;
}
</style>


</head>

<body>


<table width="800">
<tr>
<td width="121"height="191" bgcolor="#999">
</td>


<td bgcolor="#ffffff"><blockquote>
<p class="derecha">Rationse rsperem quasit ut alicimus, cus sita quuntib erepudae nullores simos ut offici repere, omnis essitiis aut aligent eumquodit, occatia santiore, autas eost, sim rem. Et qui doluptatem etur modi ad quid expliae cuptatio te plis dunt volla etur aut harum fugiam id quisciis autam ilit, qui vel molesequo tes aut qui conserum aci corum veria sin commost, aut latest untus eos sum estio est, ut archit inulparcia enda dolo dipit autaquunt vernatio quis as dolestet lit inullab oreces cone con cone mil moluptatia solores endisitio. Gendi consendi dolecte ssequi ipidebi strum, sim quatem et aut laut quiat.</p>
</blockquote></td>

<td width="117"height="191" bgcolor="#999"></td>

</tr>
</table>



</body>
</html>


Registrado desde 18/01/11
Número de posts: 13
  • Avatar de Juanmanuelalcon.com Juanmanuelalcon.com Registrado desde 07/10/08 / Número de posts: 73
    Hola compañero!
    En principio te recomendaría que no utilizaras tablas para estructuras tan sencillas aunque son perfectamente válidas, ese no es el problema.

    He visto un par de detalles que puedes revisar:
    - Lo primero, no estaría mal que a la tabla le establecieras el cellpadding y el cellspacing a 0.
    - Lo segundo ¿necesitas blockquote?, prueba a eliminarlo del código y verás como tu párrafo ocupa el ancho de la celda, si quieres utilizarlo, dale estilos a blockquote.
    - Tercero, es buena práctica resetear los estilos al principio de tu hoja de estilos, esto se hace para igualar anchos, paddings, margins, etc. en todos los navegadores, te paso un enlace al más utilizado: , este código lo colocas tal cual al comienzo de tu css.

    Te pego tu código corregido:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">;
    <html xmlns="http://www.w3.org/1999/xhtml">;
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Documento sin título</title>

    <style type="text/css">
    body{padding:0px; margin:0px;}
    .derecha { text-align: left; padding:0px; margin:0px; }
    </style>

    </head>

    <body>
    <table width="800" cellpadding="0" cellspacing="0">
    <tr>
    <td width="121"height="191" bgcolor="#999">&nbsp;</td>
    <td bgcolor="#ffffff" valign="top">
    <p class="derecha">Rationse rsperem quasit ut alicimus, cus sita quuntib erepudae nullores simos ut offici repere, omnis essitiis aut aligent eumquodit, occatia santiore, autas eost, sim rem. Et qui doluptatem etur modi ad quid expliae cuptatio te plis dunt volla etur aut harum fugiam id quisciis autam ilit, qui vel molesequo tes aut qui conserum aci corum veria sin commost, aut latest untus eos sum estio est, ut archit inulparcia enda dolo dipit autaquunt vernatio quis as dolestet lit inullab oreces cone con cone mil moluptatia solores endisitio. Gendi consendi dolecte ssequi ipidebi strum, sim quatem et aut laut quiat.</p>
    </td>
    <td width="117"height="191" bgcolor="#999">&nbsp;</td>
    </tr>
    </table>
    </body>
    </html>


    Un abrazo!
    Juan Manuel Alcón . Diseñador multidisciplinar
    www.juanmanuelalcon.com
    Publicado hace cerca de un año
  • Avatar de tandemtandem tandemtandem Registrado desde 18/01/11 / Número de posts: 13
    ¡¡¡Gracias Juan Manuel!!!, ahora mismo me meto en tu web y me hago seguidor tuyo en facebook, twitter, te hago la compra y te saco el perro a pasear.
    ¡Muchísimas gracias por el favor! :-)
    Publicado hace cerca de un año
  • Avatar de Juanmanuelalcon.com Juanmanuelalcon.com Registrado desde 07/10/08 / Número de posts: 73
    a mandar maquina!
    por cierto, no te he pasado el enlace al reset de css, aquí lo tienes:

    Eric´s Meyer Resets:
    http://meyerweb.com/eric/tools/css/reset/
    Juan Manuel Alcón . Diseñador multidisciplinar
    www.juanmanuelalcon.com
    Publicado hace cerca de un año
  • Avatar de Vmv Vmv Registrado desde 15/03/12 / Número de posts: 220
    @charset "utf-8";
    /* CSS Document */
    html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p,
    blockquote, pre, a, abbr, acronym, address, big,
    cite, code, del, dfn, em, font, img,
    ins, kbd, q, s, samp, small, strike,
    strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    center, u, b, i {
    margin: 0;
    padding: 0;
    border: 0;
    font-weight: normal;
    font-style: normal;
    font-size: 100%;
    font-family: inherit;
    vertical-align: baseline
    }

    body {
    line-height: 1
    }

    :focus {
    outline: 0
    }

    ol, ul {
    list-style: none
    }

    table {
    border-collapse: collapse;
    border-spacing: 0
    }

    blockquote:before, blockquote:after, q:before, q:after {
    content: ""
    }

    blockquote, q {
    quotes: "" ""
    }

    input, textarea {
    margin: 0;
    padding: 0
    }

    hr {
    margin: 0;
    padding: 0;
    border: 0;
    color: #000;
    background-color: #000;
    height: 1px
    }

    Ese es el reset de mi página, espero que te sirva ;)
    Publicado hace cerca de un año