<html>
<head> <title> Pure CSS no picture with arrows div box </title> <style> div.container{position:absolute; top:30px; left:40px; font-size:9pt; Display:block; height:100px; width:200px; Background-color:transparent; *border:1px solid #666; s{position:absolute; top:-20px; *top:-22px; left:20px; display:block; height:0; width:0; font-size:0; line-height:0; Border-color:transparent transparent #666 transparent; Border-style:dashed dashed solid dashed; border-width:10px; I{position:absolute; top:-9px; *top:-9px; left:-10px; display:block; height:0; width:0; font-size:0; line-height:0; Border-color:transparent transparent #fff transparent; Border-style:dashed dashed solid dashed; border-width:10px; content{border:1px solid #666;-moz-border-radius:3px;-webkit-border-radius:3px; position:absolute; Background-color: #fff; width:100%; height:100%; padding:5px; *top:-2px; *border-top:1px solid #666; *border-top:1px solid #666; *border-left:none; *border-right:none; *height:102pX; box-shadow:3px 3px 4px #999; -moz-box-shadow:3px 3px 4px #999; -webkit-box-shadow:3px 3px 4px #999; /* for IE 5.5-7 * * Filter:progid:DXImageTransform.Microsoft.Shadow (strength=4, direction=135, color= ' #999999 '); * for IE 8/-ms-filter: "Progid:DXImageTransform.Microsoft.Shadow (strength=4, direction=135, color= ' #999999 ')"; </style> </head> <body> <div class= "container" > <div class= "Content" ><br> This is the text in the box, which can be displayed dynamically. The height automatically increases, should be good ^_^ </div> <s> <i></i> </s> </div> <br/> </body> </html >Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
