12,782
edits
No edit summary |
No edit summary |
||
| Line 122: | Line 122: | ||
/* <p class="bubble-right"> */ | /* <p class="bubble-right"> */ | ||
. | .speechbubble-left { | ||
position:relative; | position:relative; | ||
padding:15px; | padding:15px; | ||
| Line 138: | Line 138: | ||
} | } | ||
. | .speechbubble-left:after { | ||
content:""; | content:""; | ||
position:absolute; | position:absolute; | ||
| Line 151: | Line 151: | ||
} | } | ||
. | .speechbubble-right { | ||
position:relative; | position:relative; | ||
padding:15px; | padding:15px; | ||
| Line 167: | Line 167: | ||
} | } | ||
. | .speechbubble-right:after { | ||
content:""; | content:""; | ||
position:absolute; | position:absolute; | ||
bottom:-20px; /* value = - border-top-width - border-bottom-width */ | bottom:-20px; /* value = - border-top-width - border-bottom-width */ | ||
left:50px; /* controls horizontal position */ | |||
border-width:20px 0 0 20px; /* vary these values to change the angle of the vertex */ | border-width:20px 0 0 20px; /* vary these values to change the angle of the vertex */ | ||
border-style:solid; | border-style:solid; | ||
| Line 180: | Line 180: | ||
} | } | ||
.bubble- | |||
.bubble-blue { | |||
background:#075698; /* default background for browsers without gradient support */ | |||
/* css3 */ | |||
color:# | background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698)); | ||
background:-moz-linear-gradient(#2e88c4, #075698); | |||
background:-o-linear-gradient(#2e88c4, #075698); | |||
background:linear-gradient(#2e88c4, #075698); | |||
} | |||
.bubble-blue:after { | |||
border-color:#075698 transparent; | |||
} | |||
.bubble-green { | |||
background:#075698; /* default background for browsers without gradient support */ | |||
/* css3 */ | |||
background:-webkit-gradient(linear, 0 0, 0 100%, from(#2e88c4), to(#075698)); | |||
background:-moz-linear-gradient(#2e88c4, #075698); | |||
background:-o-linear-gradient(#2e88c4, #075698); | |||
background:linear-gradient(#2e88c4, #075698); | |||
} | |||
.bubble-green:after { | |||
border-color:#075698 transparent; | |||
} | |||
.bubble-red { | |||
background:#075698; /* default background for browsers without gradient support */ | background:#075698; /* default background for browsers without gradient support */ | ||
/* css3 */ | /* css3 */ | ||
| Line 191: | Line 214: | ||
background:-o-linear-gradient(#2e88c4, #075698); | background:-o-linear-gradient(#2e88c4, #075698); | ||
background:linear-gradient(#2e88c4, #075698); | background:linear-gradient(#2e88c4, #075698); | ||
} | } | ||
.bubble- | .bubble-red:after { | ||
border-color:#075698 transparent; | border-color:#075698 transparent; | ||
} | } | ||