26 Haziran 2016 Pazar

Css'de Float Kullanımı 2

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"
      />
<title>Untitled Document</title>
<style>
    .kirmizidiv{
     
        width:811px;
        border:3px solid red;
     
    }
     .yesildiv{
     
        width:529px;
        border:3px solid green;
        float:left;
    }
    .mavidiv{
     
        width:262px;
        border:3px solid blue;
        float:right;
    }
    .anaicerik{
        width:490px;
        height:600px;
         border:3px solid #666;
    }
   .yandiv{
      width:200px;
      margin-bottom: 15px;
      height:170px;
        border:3px solid #000;
    }
</style>
</head>
<body>
    <div class="kirmizidiv">
     
     
        <div class="yesildiv">
     
        <div class="anaicerik"></div>
       
        </div>
     
     
        <div class="mavidiv">
            <div class="yandiv"></div>
            <div class="yandiv"></div>
            <div class="yandiv"></div>
            <div class="yandiv"></div>
            <div class="yandiv"></div>
        </div>
     
     
        <div id="temizle" style="clear:left;"></div>
        <div id="temizle2" style="clear:right;"></div>
    </div>
 
 
 
   
     
</body>
</html>

Hiç yorum yok:

Yorum Gönder