Float
Float property की इन पाँच में से कोई एक value हो सकती हैं –
- left :- यह value देने पर element left side में float होता हैं।
- right :- इससे element right side में float होता हैं।
- none :- यह value देने से element float नहीं होता हैं बल्कि page के normal flow के हिसाब से show होता हैं।
- initial :- यह keyword किसी भी CSS property की default value set करने के लिए use किया जाता है|
- inherit :- किसी element को float की value inherit देने पर वह element अपने parent element की float value लेता हैं।
1) float: left;
<html>
<head>
<style>
#divone {
border: 1px solid blue;
height: 100px;
width: 100px;
float: left;
}
#divtwo {
border: 1px solid green;
height: 100px;
width: 100px;
float: left;
}
</style>
</head>
<body>
<div id =“divone”>Box 1</div>
<div id=“divtwo”>Box 2</div>
</html>
2) float: right;
<html>
<head>
<style>
# divone {
border: 1px solid blue;
height: 100px;
width: 100px;
float: right;
}
</style>
</head>
<body>
<div id =“divone”>Box</div>
3) float: inherit;
<html>
<head>
<style>
#parent{
border: 1px solid blue;
height: 100px;
width: 100px;
float: right;
}
#box{
height: 50px;
width: 50px;
border: 1px solid green;
float: inherit;
}
</style>
</head>
<body>
<div id =“parent”>
<div id =“box”>Box</div>
</div>
</body>
</html>