.toast-container { width: 280px; z-index: 9999; } * html .toast-container { position: absolute; } .toast-item { height: auto; background: #333; opacity: 0.9; -moz-border-radius: 10px; -webkit-border-radius: 10px; color: #eee; padding-top: 20px; padding-bottom: 20px; padding-left: 6px; padding-right: 6px; font-family: lucida Grande; font-size: 14px; border: 2px solid #999; display: block; position: relative; margin: 0 0 12px 0; } .toast-item p { text-align: left; margin-left: 50px; } .toast-item-close { background:url(./images/close.gif); width:22px; height:22px; position: absolute; top:7px; right:7px; } .toast-item-image { width:32px; height: 32px; position: absolute; top: 50%; margin-top: -16px; left: 10px; } .toast-item-image-notice { background:url(./images/notice.png); } .toast-item-image-success { background:url(./images/success.png); } .toast-item-image-warning { background:url(./images/warning.png); } .toast-item-image-error { background:url(./images/error.png); } /* add for multiline */ .toast-item-message { background-position:left center; padding-left:44px; height: 32px; background-repeat:no-repeat; line-height:32px; font-size:14px; margin:5px 10px; } /** * toast types * * pattern: toast-type-[value] * where 'value' is the real value of the plugin option 'type' * */ .toast-type-notice { color: white; } .toast-type-success { color: white; } .toast-type-warning { color: white; border-color: #FCBD57; } .toast-type-error { color: white; border-color: #B32B2B; } /** * positions * * pattern: toast-position-[value] * where 'value' is the real value of the plugin option 'position' * */ .toast-position-top-left { position: fixed; left: 20px; top: 20px; } .toast-position-top-center { position: fixed; top: 20px; left: 50%; margin-left: -140px; } .toast-position-top-right { position: fixed; top: 20px; right: 20px; } .toast-position-middle-left { position: fixed; left: 20px; top: 50%; margin-top: -40px; } .toast-position-middle-center { position: fixed; left: 50%; margin-left: -140px; margin-top: -40px; top: 50%; } .toast-position-middle-right { position: fixed; right: 20px; margin-left: -140px; margin-top: -40px; top: 50%; }