2017-08-09 81 views
-1

所有其他div設置均可使用,但使用類.l100和.p100時,圖像不顯示。Div將不會顯示在帶ID的div中100%寬度#portofolio

我試圖重新安排換了別人後.l100和.p100的風格,但它使.l75和.p75 dissapear ...

任何人可以幫助這一點,下面的代碼:

* { 
 
    \t margin: 0px; 
 
    \t padding: 0px; 
 
    } 
 
    
 
    #portofolio { 
 
    \t width: 80%; 
 
    \t margin: auto; 
 
    } 
 
    
 
    .image { 
 
    \t background-size: cover; 
 
    \t background-repeat: no-repeat; 
 
    \t background-position:center; 
 
    \t 
 
    \t position: relative; 
 
    \t 
 
    \t margin-bottom: 1%; 
 
    \t margin-right: 1%; 
 
    \t box-sizing: border-box; 
 
    \t 
 
    \t /*-webkit-box-shadow: 10px 10px 58px -20px rgba(0,0,0,0.75); 
 
    \t -moz-box-shadow: 10px 10px 58px -20px rgba(0,0,0,0.75); 
 
    \t box-shadow: 10px 10px 58px -20px rgba(0,0,0,0.75);*/ 
 
    \t 
 
    \t float: left; 
 
    
 
    } 
 
    
 
    //portrait 
 
    
 
    .p100 { 
 
    \t width: 99%; 
 
    \t padding-bottom: 177.77%; \t 
 
    \t margin-right: 0%; 
 
    
 
    } 
 
    .p75 { 
 
    \t width: 74%; 
 
    \t padding-bottom: 133.33%; \t 
 
    
 
    } 
 
    
 
    .p50 { 
 
    \t width: 49%; 
 
    \t padding-bottom: 88.88%; \t 
 
    
 
    } 
 
    .p25 { 
 
    \t width: 24%; 
 
    \t padding-bottom: 42.1%; \t 
 
    
 
    } 
 
    
 
    
 
    //landscape 
 
    
 
    .image.l100 { 
 
    \t width: 99%; 
 
    \t padding-bottom: 56.25%; 
 
    
 
    \t \t 
 
    } 
 
    
 
    .l75 { 
 
    \t width: 74%; 
 
    \t padding-bottom: 42.1875%; 
 
    } 
 
    
 
    .l50 { 
 
    \t width: 49%; 
 
    \t padding-bottom: 28.125%; 
 
    } 
 
    
 
    .l25 { 
 
    \t width: 24%; 
 
    \t padding-bottom: 14.0625%; 
 
    }
<div id="wrapper"> 
 
    <div id="header"></div> 
 
    
 
    
 
    <div id="portofolio"> 
 
    
 
    <!--<div style="width: 100%; height: 400px; overflow-y: hidden; overflow-x:visible;margin-bottom: 2vh;">--> 
 
    <div class="image p25" style="background-image: url(https://image.ibb.co/jJ4rNF/g7_XLRx_E2_crop.jpg);"></div><!--https://image.ibb.co/cdpKba/g7XLRxE.jpg--> 
 
    <div class="image l75" style="background-image: url(https://image.ibb.co/dVGMpv/329_Flower.jpg);"></div><!--</div>--> 
 
    
 
    <div class="image l50" style="background-image: url(https://image.ibb.co/dgwkhF/20170501_135937_DARKER_CROPPED.jpg);"></div> 
 
    <div class="image l50" style="background-image: url(https://image.ibb.co/h1WPba/ezgif_com_crop_PROBABLY_THE_BEST.gif);"></div> 
 

 
    
 
    <div class="image l100" style="background-image: url(https://image.ibb.co/fJL4ba/20170604_222345.jpg);"></div> 
 
    
 
    </div> 
 
    </div>

回答