2017-10-16 82 views
0

在小屏幕和標籤上彼此重疊的列, 但在寬屏幕上正常工作。 在小屏幕上重疊的列

    <div class="col-md-4 col-md-4 col-xs-4"> 
        <img class="img-valign" src="img/Hotel/Kempenski.jpg" width="350px;" height="200px;" alt="" /> 
        </div> 




        <div class="col-md-4 col-sm-4 col-xs-4" align="left" style="margin-top: 5%;"> 
         <h4 align="justify" style="text-decoration: underline"><strong>Recommended Hotel</strong></h4> 
         <p align="justify"><strong>Burj Rafal Hotel Kempinski</strong></p> 
         <p align="justify">7647 King Fahd Road,<br> Exit 4, As Sahafah District، As Sahafah,<br> Riyadh - Sauid Arabia</p> 
         <p align="justify">&nbsp;</p> 
         <p align="justify"><strong>4.2 Star Ratings</strong></p> 
        </div> 

        <div class="col-md-4 col-sm-4 col-xs-4" align="left" style="margin-top: 5%;"> 

         <p align="justify"><strong>Hotel Fare</strong></p> 
         <p align="justify">Starting from: 1,160 SAR</p> 
        </div> 

       </div>` 

回答

0

在這裏,我找到了解決辦法,我是在錯誤的manner`

<div class="col-xs-12 col-lg-4"> 
     <img class="img-responsive" src="img/Hotel/Kempenski.jpg" width="350px;" height="200px;" alt="" />  
    </div> 

    <div class="col-xs-12 col-lg-4"> 
    <h4 align="justify" style="text-decoration: underline"><strong>Recommended Hotel</strong></h4> 
         <p align="justify"><strong>Burj Rafal Hotel Kempinski</strong></p> 
         <p align="justify">7647 King Fahd Road,<br> Exit 4, As Sahafah District، As Sahafah,<br> Riyadh - Sauid Arabia</p> 
         <p align="justify">&nbsp;</p> 
         <p align="justify"><strong>4.2 Star Ratings</strong></p> 

    </div>   

    <div class="col-xs-12 col-lg-4">     
         <p align="justify"><strong>Hotel Fare</strong></p> 
         <p align="justify">Starting from: 1,160 SAR</p> 
    </div> 

  ` 
分配列
相關問題