수직 분배기 CSS

Question

수직 분배기를 만들면 정상적으로 작동합니다. 그러나 CSS는 성가시다.

CSS의는 다음과 같습니다

.headerDivider1 { 
border-left:1px solid #38546d;height:80px;position:absolute;right:250px;top:10px; 
} 

.headerDivider2 { 
border-left:1px solid #16222c;height:80px;position:absolute;right:249px;top:10px; 
} 

HTML은 다음과 같습니다

<div class="headerDivider1"></div><div class="headerDivider2"></div> 

결과는 다음과 같습니다

가 어떻게이 HTML과 CSS를 위로 정돈 수 있을까?

Answer 1

.headerDivider { 
    border-left:1px solid #38546d; 
    border-right:1px solid #16222c; 
    height:80px; 
    position:absolute; 
    right:249px; 
    top:10px; 
} 

<div class="headerDivider"></div> 

Answer 2

<div class="headerdivider"></div> 

및

.headerdivider { 
    border-left: 1px solid #38546d; 
    background: #16222c; 
    width: 1px; 
    height: 80px; 
    position: absolute; 
    right: 250px; 
    top: 10px; 
} 

당신이 피하기 위해 생각하고 알고