Üye Girişi
Bağlan Google+ ile Bağlan Facebook ile Bağlan
Yeni Kayıt
Tüm Forumlar
  • Tüm Forumlar
  • Web Tasarım - Programlama
  • Tasarım ve grafik
  • Web Tasarım ve Hazır Kodlar
  • Bu Konuda
Şimdi Ara

Sayfayı iki eşit parçaya bölemiyorum, CSS de takıldım

Sıcak Fırsatlarda Tıklananlar
Editörün Seçtiği Fırsatlar
Bu Konudaki Kullanıcılar:
2 Misafir (1 Mobil) - 1 Masaüstü, 1 Mobil
5 sn
2
Cevap
0
Favori
3.534
Tıklama
Daha Fazla
İstatistik
  • Konu İstatistikleri Yükleniyor
Konuya Özel
0 oy
Öne Çıkar
Cevapla
Sayfa: 1
Giriş
Mesaj
  • Arkadaşlar sayfayı ikiye bölemiyoum şöyleki
    HTML kodu böyle, en başta her şeyi kapsayan bir div var "back_page"
    daha sonra onun çocuğu olan 2 div daha "first, second"
    en son da first'ün çocuğu var div "1"

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <link rel="stylesheet" href="style.css">
        <title>SAMPLE</title>
      </head>
      <body>
        <div class="back_page">
          <div class="first">
            <h1>first class</h1>
            <div class="1">
              <h1>text inside the first class</h1>
            </div>
          </div>
          <div class="second">
            <h1>second class</h1>
          </div>
        </div>
      </body>
    </html>


    Şimdi ben first ve second için sayfayı eşit iki parçaya bölmek istiyorum.
    İşte Css kodu


    *
    {
      box-sizing: border-box;
    }

    html, body, h1, h2, h3, ul, li, a, p,
    header, main, section, article, footer, aside, nav
    {
      margin: 0;
      padding: 0;
    }

    header, main, section, article, footer, aside, nav
    {
      display: block;
    }


    .back_page
    {
      background-color: #199;
      height: 100%;
      display: block;
    }

    .first
    {
      float: left;
      height: 100%;
    }

    .second
    {
      height: 100%;
      float: left;
    }


    lakin ekran şöyle oluyor.
    Sayfayı iki eşit parçaya bölemiyorum, CSS de takıldım

    Sayfayı iki eşit parçaya bölemiyorum, CSS de takıldım


    Hiçbiri ekranın tamamını kaplamamış.
    Birde CSS deki bazı kodlar kopyala yapıştır. Anlamadığım yerler var
    1) display:block
    2) box-sizing: border-box







  • Bkz: .clear{clear:both}


    Örnek Kodlama Aşağıda; 


     
       
      { 
      box-sizing: border-box; 
      } 
       
      html, body, h1, h2, h3, ul, li, a, p, 
      header, main, section, article, footer, aside, nav 
      { 
      margin: 0; 
      padding: 0; 
      } 
       
      header, main, section, article, footer, aside, nav 
      { 
      display: block; 
      } 
       
       
      .back_page 
      { 
      background-color: #199; 
      display: block; 
      } 
       
      .first 
      { 
      float: left; 
      width:50%; 
      } 
       
      .second 
      { 
      float: left; 
      width:50%; 
      }  
       
      .clear{clear:both;} 
      


     
      <!DOCTYPE html> 
      <html> 
      <head> 
      <meta charset="utf-8"> 
      <link rel="stylesheet" href="style.css"> 
      <title>SAMPLE</title> 
      </head> 
      <body> 
      <div class="back_page"> 
      <div class="first"> 
      <h1>first class</h1> 
      <div class="1"> 
      <h1>text inside the first class</h1> 
      </div> 
      </div> 
      <div class="second"> 
      <h1>second class</h1> 
      </div> 
      <div class="clear"></div> 
      </div> 
      </body> 
      </html>

    < Bu ileti tablet sürüm kullanılarak atıldı >




    • Yapay Zeka’dan İlgili Konular
    c# listbox da aşağı doğru artan yazı nasıl yazılır?
    12 yıl önce açıldı
    4 sayfa bir pdf'yi 1 sayfaya nasıl daraltabilirim?
    5 yıl önce açıldı
    Birden Çok Resmi Alt Alta Tek Bir Resim Dosyası Yapma?
    13 yıl önce açıldı
    Daha Fazla Göster
    
Sayfa: 1

Benzer içerikler

- x
Bildirim
mesajınız kopyalandı (ctrl+v) yapıştırmak istediğiniz yere yapıştırabilirsiniz.
Hizmet kalitesi için çerezleri kullanabiliriz, DH'yi kullanırken depoladığımız çerezlerle ilgili veri politikamıza gözatın.
Kabul Ediyorum