Как сделать границу div, не занимая лишнего места в html?

Ответ 1

У вас есть 3 варианта:

• Внутренние и внешние поля (как указано в @xpapad).
• Использование outline, например outline:1px #000 solid;. Подробнее.
• Использование box-sizing, которое является свойством css3. Например, box-sizing:border-box;. Подробнее.

Ответ 2

вы можете компенсировать отрицательный запас или просто использовать контур.

div { border: 10px solid red; margin: -10px};

или

div { outline: 10px solid red; }

В качестве альтернативы вы можете использовать css3 boxshadow для подделки границы...

Пример: http://jsfiddle.net/meo/K23s7/

Ответ 3

Попробуйте использовать отрицательный запас, эквивалентный вашей границе, например.

border-right:1px;
margin-right:-1px;

Ответ 4

Включите внутренний div внутри текущего div, используя требуемую границу.