Граница CSS не работает

Я пытаюсь получить границу с обеих сторон мой белый контейнер. Это просто не показано. На всякий случай я попытался поместить его в три разных элемента! (Смотри ниже). Любые идеи о том, как заставить его работать?

#wrapper {
    width:1000px;
    background:#F4F4F4;
    padding-top:5px;
    border: 3px #CDCDCD;
    overflow: auto;
    min-height: 100%;
    height: auto !important;
    height: 100%;
    margin: 0 auto;  
}

#casing {
    padding:0px 0px 0px 0px;
    background:#Fff;
    border: 0 1px 0 1px solid #000;
}   

#cover {
    border: 0 1px 0 1px solid #000;
}

Ответы

Ответ 1

Сделайте это:

border: solid #000;
border-width: 0 1px;

Живая демонстрация: http://jsfiddle.net/aFzKy/

Ответ 2

Я думаю, что вы только что создали сокращенный синтаксис для свойства border: там =)

Попробуйте просто:

border-right: 1px solid #000;
border-left: 1px solid #000;

Ответ 3

AFAIK, нет такой сокращенности для границы. Вы должны определить каждую границу отдельно:

border: 0 solid #000;
border-left: 1px solid #000;
border-right: 1px solid #000;

Ответ 4

Пробовали ли вы использовать Firebug для проверки визуализированного HTML и посмотреть, что именно применяется css для различных элементов? Это должно забрать ошибки css, как упомянутые выше, и вы можете увидеть, какие стили наследуются и откуда - это тоже неоценимо для любой отладки css.

Ответ 5

Используйте эту строку кода в своем CSS

border: 1px solid #000 !important;

или если вы хотите, чтобы граница была только в левой и правой части контейнера, используйте:

border-right: 1px solid #000 !important;
border-left: 1px solid #000 !important;

Ответ 6

Высота на 100% неуверена, попробуйте положить diplay: block; or display: inline-block;