Alan daralınca alta kayan div (normalde yanyana)

0

Lütfen yardım edin projem için önemli alt alra kaymasın :( 

 

 

 

<br />
<div id="anadiv" v="">
<div style="float:left">
<div style="text-align: right;margin:1px;"><a class="hvr-buzz-out" href="" style="display: block; vertical-align: middle; transform: translateZ(0px); box-shadow: rgba(0, 0, 0, 0) 0px 0px 1px; backface-visibility: hidden; line-height: 25px; margin-bottom: 2px; text-align: center; text-decoration: none; color: rgb(216, 225, 226); font-family: Verdana, Geneva, sans-serif; font-size: 14px; width: 100%; max-width:159px; background-color: rgb(216, 225, 226);"><span style="font-size: small;"><strong><span style="color: rgb(0, 0, 0);">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; <br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</span></strong></span><span style="font-size: medium;"><span style="color: rgb(0, 0, 0);"><br />
<br />
<br />
<br type="_moz" />
</span></span></a></div>
</div>
<div style="float:left">
<div style="text-align: right;margin:1px;"><a class="hvr-buzz-out" href="" style="display: block; vertical-align: middle; transform: translateZ(0px); box-shadow: rgba(0, 0, 0, 0) 0px 0px 1px; backface-visibility: hidden; line-height: 25px; margin-bottom: 2px; text-align: center; text-decoration: none; color: rgb(216, 225, 226); font-family: Verdana, Geneva, sans-serif; font-size: 14px; width: 100%; max-width:159px; background-color: rgb(216, 225, 226);"><span style="font-size: small;"><strong><span style="color: rgb(0, 0, 0);">&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;</span></strong><span style="color: rgb(0, 0, 0);">&nbsp; &nbsp;&nbsp;</span></span><span style="font-size: medium;"><span style="color: rgb(0, 0, 0);"><br />
<br />
<br />
<br />
<br type="_moz" />
</span></span></a></div>
</div>
</div>
<table>
    <tbody>
        <tr>
            <td>
            <div style="width: 100%; max-width:320px; overflow: auto;">&nbsp;<br />
            <br />
            <br />
            <br />
            <br />
            <br />
            &nbsp;</div>
            </td>
            <td>
            <div style="width: 100%; max-width:320px; overflow: auto;">&nbsp;<br />
            <br />
            <br />
            <br />
            &nbsp;&nbsp;</div>
            </td>
        </tr>
    </tbody>
</table>
<br />
<div style="width: 100%; max-width:320px; overflow: auto;">&nbsp;</div>
<table>
</table>

ibrahimyucel ibrahimyucel (1)
3 yıl önce sordu

    Toplam 2 Cevap


    0

    İstediğini yanlış anlamadıysam şu şekilde yapabilirsin:

    <!DOCTYPE html>
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="utf-8" />
        <title></title>
    </head>
    
    <body>
        <style>
            .kutu {
                height: 300px;
                width: 300px;            
                background-color: #ff0000;
                display: inline-block;            
              
            }
        </style>
        <div style="min-width:650px;display:block; background-color:#0094ff">
            <div class="kutu"></div>
            <div class="kutu"></div>
        </div>
    </body>
    </html>

    Bir taşıyıcı kutu içine diğer kutuları yerleştirip daha sınra taşıyıcı kutuya min-width yani minimum genişlik verirsen kutular tarayıcı penceresi daralsa da yan yana gelmez.

    alattin alattin (15095)
    3 yıl önce cevaplandı

      0

      verdiğiniz kod üzerinde oynama yaptım diğer kodun içine koydum lakin sonuç aynı mobilde alt alta kayıyor :( 

       

       

      <html lang="en" xmlns="http://www.w3.org/1999/xhtml">
      <head>
          <meta charset="utf-10" />
          <title></title>
      </head>

      <body>
          <style>
              .kutu {
                  height: 158px;
                  width: 158px;            
                  background-color: #D7E1E2;
                  display: inline-block;            
                
              }
          </style>
              <div class="kutu"></div>
              <div class="kutu"></div>
          </div>
      </body>
      </html>

      ibrahimyucel ibrahimyucel (1)
      3 yıl önce cevaplandı

        üyelik gerektirir

        Cevap yazabilmek için üye girişi yapmalısınız.

        Eğer uzmanim.net üyesiyseniz giriş yapabilirsiniz: üye girişi yap
        uzmanim.net'e üye olmak çok kolaydır: hemen kayıt ol