Переопределение ширины таблицы таблиц CSS

У меня есть два элемента на моей странице, размещенные вместе в столбцах, таких как статьи на странице газеты. Один элемент - это тег <aside> с основным содержимым внутри тега <section>.Переопределение ширины таблицы таблиц CSS

Контейнер имеет край 15px слева от него, что приводит к его проливанию с правой стороны окна просмотра, когда его ширина установлена на 100%. Как я могу помешать этому сделать это.

Вы можете увидеть пример с этой скрипкой: http://jsfiddle.net/spryno724/BHr5F/2/

Примечание: Я знаю, что могу использовать функцию calc() для выполнения этой задачи, но учитывая its current browser support и свою аудиторию, я не готов полагаться по этой функции.

источник

2013-08-21 Oliver Spryn

я не получил его, не могли бы вы разработать? –

@HashemQolami Посмотрите ссылку JSFiddle, и вы можете увидеть в окне результатов, что вам нужно прокрутить вправо, чтобы просмотреть весь контент. Это из-за 'margin-left: 15px' и' width: 100% '. Я пытаюсь вставить содержимое в окно. –

простое решение заключается в использовании обивка налево на .row контейнере вместо Маржа налево по содержанию, как можно видеть в моем обновленном jsfiddle:

div.row { 
    background-color: rgba(51, 51, 51, 0.9); 
    display: table-row; 
    padding-left: 15px; 
}

http://jsfiddle.net/BHr5F/4/

источник

2013-08-21 21:04:38 Dragony

Я пробовал это. Вы можете видеть, что отступы слева от боковой панели теперь исчезли. –

Here есть много хороших ответов. Мой любимый:

.container { 
    width:90%; 
    margin: auto; 
}

источник

2013-08-21 21:05:37 Joram

Добавить padding-left: 15px в body элемент и удалить запас из section.container:

body { 
    margin: 0; 
    padding-left: 15px; 
} 

section.container { 
    border: 1px solid black; 
    display: table; 
    max-width: 100%; 
    overflow: hidden; 
    table-layout: auto; 
    width: 100%; 
}

JSFiddle Demo #1

Вы также можете использовать box-sizing: border-box; для расчета ширины свойства включают прокладку и границы. и удалить горизонтальную полосу прокрутки:

* { 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
}

JSFiddle Demo #2

источник

2013-08-21 21:29:57

Переопределение ширины таблицы таблиц CSS

ответ

Смежные вопросы