42 lines
1.1 KiB
HTML
42 lines
1.1 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>CSS Test: left float, inset + shape-margin, % units</title>
|
|
</head>
|
|
<style>
|
|
#container {
|
|
position: absolute;
|
|
left: 25px;
|
|
width: 200px;
|
|
height: 200px;
|
|
font-family: Ahem;
|
|
font-size: 20px;
|
|
background-color: red;
|
|
color: green;
|
|
}
|
|
#test-shape {
|
|
float: left;
|
|
width: 200px;
|
|
height: 200px;
|
|
-webkit-shape-margin: 10%;
|
|
-webkit-shape-outside: inset(40px 100px 40px 0px);
|
|
}
|
|
#static-shape {
|
|
position: absolute;
|
|
left: 25px;
|
|
width: 100px;
|
|
height: 120px;
|
|
top: 70px;
|
|
border: 20px solid green;
|
|
background-color: green;
|
|
}
|
|
</style>
|
|
<body>
|
|
<p>The test passes if there is a green square and no red.</p>
|
|
<div id="container">
|
|
<div id="test-shape"></div>
|
|
XXXXXXXXXX XXXX XXXX XXXX XXXX XXXX XXXX XXXX XXXX XXXXXXXXXX
|
|
</div>
|
|
<div id="static-shape"></div>
|
|
</body>
|
|
</html> |