爲什麼CSSArrowPlease無法正常工作？

我正在嘗試使用CSS Arrow Please生成一個箭頭指向右側的邊框。然而，它不工作，只有邊界顯示，我不完全確定爲什麼。有任何想法嗎？附：我使用Chrome 28.0.1500.95爲什麼CSSArrowPlease無法正常工作？

編輯：鏈接到JSFiddle

CSS

.green { 
position: relative; 
background: #none; 
border: 4px solid green; 
} 
.green:after, .green:before { 
left: 100%; 
border: solid transparent; 
content: " "; 
height: 0; 
width: 0; 
position: absolute; 
pointer-events: none; 
} 

.green:after { 
border-color: rgba(0, 0, 0, 0); 
border-left-color: #none; 
border-width: 30px; 
top: 50%; 
margin-top: -30px; 
} 

.green:before { 
border-color: rgba(0, 0, 0, 0); 
border-left-color: green; 
border-width: 36px; 
top: 50%; 
margin-top: -36px; 
}

我給一個班「綠色」

<%= image_tag(step.o_connection.cord_type.image.url(:thumb), :class => "green") %>

來源

2013-08-16 Eric Filkins

你可以用你的代碼小提琴嗎？ – Sergio

沒有顏色'＃none'。我想你不想要''''''''。 –

小提琴在這裏：http://jsfiddle.net/GFFQc/3/ –

的目的

將你的圖像包裝在div中，並將該類應用於div。

來源

2013-08-16 21:00:59

爲什麼CSSArrowPlease無法正常工作？

回答

相關問題