Rumah  >  Soal Jawab  >  teks badan

javascript - Lajur kanan mempunyai lebar tetap, dan lajur kiri adalah adaptif dan mempunyai lebar minimum

Lajur kanan mempunyai lebar tetap dan lajur kiri adalah adaptif, tetapi apabila tetingkap dikecilkan ke tahap tertentu, lajur kiri tidak lagi menjadi lebih kecil. Jika saya ingin mencapai kesan ini, bagaimana saya harus meletakkannya?

phpcn_u1582phpcn_u15822721 hari yang lalu950

membalas semua(3)saya akan balas

  • phpcn_u1582

    phpcn_u15822017-05-31 10:41:00

    Lebar min lajur kiri anda: 300px; Malah, cara paling mudah untuk menulisnya ialah:

    .left{
        float:left;
        display:inline-block;
        ...
    }
    .right{
        width: 600px;
        ...
    }

    Dan adakah ini masalahnya? Mengapa anda tidak melihat masalahnya?

    Susulan:

            .wrapper{
                width:100%;
                position:relative;
                overflow: scroll;
                min-width: 900px;
            }
            .left{
                min-width: 300px !important;
                position: absolute;
                right: 600px;
                background-color: yellow;
                height:500px;
                width: 100%;
            }
            .right{
                width: 600px;
                height:500px;
                float: right;
                background-color: red;
            }

    Ini sepatutnya memenuhi keperluan anda, tetapi saya tidak tahu bagaimana anda mahu mempersembahkan saiz akhir kurang daripada 900px, jadi saya hanya menggunakan bar skrol

    balas
    0
  • 某草草

    某草草2017-05-31 10:41:00

    <p class="wrapper">
        <p class="left"></p>
        <p class="right"></p>
    </p>
    
    .wrapper{
        position:relative;
        height:auto;
        padding-right: 600px;
        min-width: 900px;
        -webkit-box-sizing:border-box ;
        box-sizing:border-box ;
    }
    
    .right{
        position:absolute;
        right:0px;
        top:0px;
        width: 600px;
        min-height: 100%;
        height:auto;
        background: #000;
    }
    
    .left{
        position: relative;
        background: #c0c0c0;
        height: 400px;
    }
    

    balas
    0
  • 我想大声告诉你

    我想大声告诉你2017-05-31 10:41:00

    .con(.l,.r)
    .con
    display:flex;
    flex-wrap:nowrap;
    width:100%;
    height:xpx;
    .l
    ....
    .r
    .. ..
    Anda sepatutnya dapat memahaminya
    Tetapi terpulang kepada anda untuk menetapkan lebar tetap
    flex sebenarnya lebih baik menggunakan perkadaran

    balas
    0
  • Batalbalas