Граница не отображается

Question

Я довольно новичок в CSS-границах, и у меня возникли некоторые проблемы, которые, похоже, не в состоянии исправить. Как им это известно, и есть много других, интересующихся тем же (из новичков css). У меня есть эта граница, которая должна работать нормально, согласно моему мышлению (может быть, полна неправильной логики). Код я использую для парения и по умолчанию состояния:

.profile-box .opener { 
    float:left; 
    background: url(http://seek4fitness.net/Design/Gfx/DropDowns/white.on.red/icn_small_black_arrow_down.gif) no-repeat; 
     background-position: center center; 
     background-color: #fff; 
    width:32px; 
    height:38px; 
    overflow:hidden; 
    text-indent:-9999px; 
     border-left:1px solid #dde2e8; 
} 
.profile-box .opener:hover { 
    float:left; 
    background: url(http://seek4fitness.net/Design/Gfx/DropDowns/white.on.red/icn_small_black_arrow_down.gif) no-repeat; 
     background-position: center center; 
     background-color: #F0F0F0; 
    width:32px; 
    height:38px; 
    overflow:hidden; 
    text-indent:-9999px; 
     border-left:1px solid #dde2e8; 
} 

проблема не кажется мне каким-либо образом, и им в два раза, новое для CSS сказал. Пожалуйста, помогите мне с этим. Это будет очень много для меня. Благодарю.

FIDDLE: http://jsfiddle.net/dCe3u/

Answer 1

Если вы хотите применить границу все четыре стороны вы должны изменить

border-left:1px solid #dde2e8; 

в

border:1px solid #dde2e8; 

FIDDLE HERE

границы левого применит границу только с левой стороны, Вы можете обратиться больше на границе здесь CSS BORDER >>

Answer 2

Я только что проверил ваш код. Я буквально копирую и вставляю свой код, и граница появляется, я думаю, проблема в том, что цвет границы слишком светлый (если вы используете белый фон). См. Демонстрацию http://codepen.io/ImBobby/pen/yicCz. В этой демонстрации я намеренно меняю цвет границы на красный.

Я также заметил, что вы заявили о том же стиле при наведении объекта .opener, за исключением фона. Вы можете изменить свой код в это:

.opener { 
    float: left; 
    background: url(http://seek4fitness.net/Design/Gfx/DropDowns/white.on.red/icn_small_black_arrow_down.gif) no-repeat; 
    background-position: center center; 
    background-color: #fff; 
    ... 
} 

.opener:hover { 
    background-color: #F0F0F0; 
} 

краткое объяснение, .opener:hover наследует стили от opener.