2011-12-30 27 views
27

Tomemos como ejemplo la siguiente imagen de un proyecto en el que estoy trabajando ... El fondo azul es un DIV que está dentro de otro DIV que envuelve todo el contacto de la barra lateral sección juntos. Para obtener el Blue BG DIV tener la frontera redonda y no tener un hueco debido a la padres margen/acolchado tuve que usar márgenes negativos
margin: -9px -2px 8px -6px;¿Es una mala práctica usar márgenes negativos o relleno en CSS

Entonces la pregunta es, ¿es una mala práctica de usar márgenes negativos o acolchado?

enter image description here

+3

rellenos negativos no se les permite (y no funcionan) en css, sólo los márgenes negativos. – biziclop

+0

@biziclop gracias por la información, creo que yo estaba tratando de él y no estaba trabajando, pensé que era algo más que a caballo por lo que es realmente bueno saber ahora – JasonDavis

+0

@JasonDavis que depende de lo que los utilizó. Al igual que ellos usan bootstrap, funcionan bien debido a bootstrap, se encargan de todas las cosas a su alrededor y de todo. Lo mismo ocurre aquí si está utilizando un margen negativo, entonces debe cuidar todos los dispositivos; de lo contrario, en algunas pantallas puede crear el desplazamiento horizontal o vertical. –

Respuesta

31

n; no es una mala práctica, siempre que sepa que está utilizando márgenes negativos, y que esto necesariamente "tira"/"mueve" elementos de su posición "normal".

¿Por qué incluso preocuparse por esto?

+1

Además, la especificación CSS cubre márgenes negativos bastante bastante. (Por cierto, no he escrito a www-estilo sin embargo ... He estado ocupado modding, pero veo que está ayudando a sí mismo a estas preguntas :) – BoltClock

+5

La razón principal por la que estaba preguntando era yo porque no quería que codificar un sitio entero o 2 usándolos y luego descubrir que no era bueno para hacerlo, sólo quería asegurarse de – JasonDavis

+0

sé que esto es una respuesta muy viejo, sólo quería decir que también no debería preocuparse por la "mala práctica" con el estilo, siempre y cuando funcione en los navegadores que desee admitir, entonces todo es A-ok :) – Canvas

6

márgenes negativos son una gran manera de negar el relleno en el interior de un elemento para encabezados etc. No he encontrado ninguna resultados negativos (perdón por el juego de palabras) de la utilización de los márgenes negativos. Por ejemplo:

<div style="padding:10px;border:1px solid blue;"> 
<div style="margin:-10px -10px 10px -10px;backgorund-color:yellow;">Full width heading</div> 
The content of the div which is now padded in by ten pixels. 
<div> 

Estaba preocupado por los márgenes negativos cuando por primera vez los descubrí, pero los he encontrado para ser muy útil es así que muchas áreas-diseño en realidad la reducción de los recuentos div y la limpieza de código de diseño.

Cuestiones relacionadas