고정 오류 경고 옆에 x 배치

Question

부트 스트랩 경고 메시지를 사용자 정의하여 페이지 상단에 고정되도록합니다. 유일한 문제는 메시지의 오른쪽에있는 x 버튼을 얻는 것 같습니다.

여기

는 HTML입니다 : 여기

<%= content_tag(:div, msg, class: "alert alert-info") %> 
<button class="close" data-dismiss="alert">×</button> 

와 CSS된다

.alert-info { 
    position: fixed; 
    display: block; 
    top: 10px; 
} 

.close { 
    position: fixed; 
    top: 0; 
} 

그것은 이렇게합니다 (x가 상단에있는 작은 빨간입니다) 보이는 어떻게하면 x을 경고와 함께 수직 가운데에 배치하고 오른쪽에 배치 할 수 있습니까? 나는 빛 빨간 하나를 사용하는 것이 경고 메시지의 유형에 대해

Answer 1

http://jsfiddle.net/DLY6Y/19/

. 고정 된 위치에 대해 경고 맞춤형 추가 맞춤 클래스를 추가합니다.

<div class="alert alert-danger alert-dismissable alert-fixed"> 
<button type="button" class="close" data-dismiss="alert" aria-hidden="true">&times;</button><strong>Warning!</strong> Invalid email or password.</div>