html - Div under div right aligned -
i trying create layout divs have different colours...so have problem in aligning 3 divs in right side of page, , must this: div1 on top, div2 under div1, , div3 under div2.
div a1 div a5 div a6
here's html code:
<html> <head> <title>div</title> </head> <body> <link rel="stylesheet" href="colourscss.css" type="text/css"> <div class="a2">two</div> <div class="a1">one</div> <div class="a5">five</div> <div class="a6">six</div> <div class="verticalspace"></div> <div class="a3">three</div> <div class="horizontalspace"></div> <div class="a4">four</div> </body> </html>
and css code:
.a1, .a2, .a3, .a4, .a5, .a6 { border: 4px solid; } .verticalspace, .horizontalspace { border: 0px; float: left; } .a2 { height: 250px; float: left; background-color:red; width: 100%; } .a3 { height: 100%; float: left; width: 20%; background-color: #eeeeee; } .a4 { height: 100px; float: left; width: 100%; background-color: red; } .a1 { height: 20%; width: 23%; float: right; background-color:blue; } .a5 { height: 20%; width: 23%; float: right; background-color: yellow; position:relative; } .a6 { height:20%; width: 23%; float: right; background-color: green; }
check jsfiddle: http://jsfiddle.net/x08j29m5/1
.a1, .a5, .a6 {clear:right;}
i added clear:right; a1, a5 , a6, don't know want do, there might more appropriate solution.
html css
No comments:
Post a Comment