向左浮動不起作用

我是HTML和CSS的初學者。這是我的問題。向左浮動不起作用

驗證碼：

.floatleft {float: left} 
.floatright {float: right} 
.colum{width: 1170px; margin: 0 auto;} 
.fix {overflow: hidden} 
.clear {clear: both}

<div class="services_area"> 
    <div class="colum"> 
    <div class="services"> 
     <div class="services_title fix"> 
     <h1>About Me</h1> 
     <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <span>quis nostrud exercitation ullamco</span> laboris nisi ut aliquip ex ea commodo consequat duis aute irure dolor.</p> 
     </div> 
    </div> 
    <div class="services_list"> 
     <div class="ss_list floatleft"> 
     <img src="img/bulb.png" alt=""> 
     <h3>Title goes here</h3> 
     <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
     </div> 
     <div class="ss_list floatleft"> 
     <img src="img/pen.png" alt=""> 
     <h3>Title goes here</h3> 
     <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
     </div> 
     <div class="ss_list floatleft"> 
     <img src="img/settings.png" alt=""> 
     <h3>Title goes here</h3> 
     <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
     </div> 
     <div class="ss_list floatleft"> 
     <img src="img/desktop.png" alt=""> 
     <h3>Title goes here</h3> 
     <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
     </div> 
    </div> 
    </div> 
</div>

沒有更多的代碼。第一次我想只是向左漂浮，那麼這件事就會發生。

這裏有什麼錯誤？我現在應該怎麼做？

來源

2016-05-17 MD Foysal Ahamed

你應該使用明確的：兩者兼而有之。 –

你沒有'.floatleft'類。但是你有'.floatright'向左浮動。 – choz

'.floatright'到'.floatleft'？ –

看看你的代碼的頂部。 floatright {float: left} < ==它看起來像你設置了錯誤的float在錯誤的類。

來源

2016-05-17 06:15:59

我改變了這一點，也清除了兩者。現在它的工作。 –

應該.floatleft{float: left;}

來源

2016-05-17 06:17:21 Rahul

You have mistaken as .floatright to be change as .floatleft in your style

.floatleft {float: left} 
 
.colum{width: 1170px; margin: 0 auto;} 
 
.fix {overflow: hidden}

<div class="services_area"> 
 
      <div class="colum"> 
 
       <div class="services"> 
 
        <div class="services_title fix"> 
 
         <h1>About Me</h1> 
 
         <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, <span>quis nostrud exercitation ullamco</span> laboris nisi ut aliquip ex ea commodo consequat duis aute irure dolor.</p> 
 
        </div> 
 
       </div> 
 
       <div class="services_list"> 
 
        <div class="ss_list floatleft"> 
 
         <img src="img/bulb.png" alt=""> 
 
         <h3>Title goes here</h3> 
 
         <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
 
        </div> 
 
        <div class="ss_list floatleft"> 
 
         <img src="img/pen.png" alt=""> 
 
         <h3>Title goes here</h3> 
 
         <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
 
        </div> 
 
        <div class="ss_list floatleft"> 
 
         <img src="img/settings.png" alt=""> 
 
         <h3>Title goes here</h3> 
 
         <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
 
        </div> 
 
        <div class="ss_list floatleft"> 
 
         <img src="img/desktop.png" alt=""> 
 
         <h3>Title goes here</h3> 
 
         <p>onsectetur adipisicing elit, sedo eiusmod tempor incidi et dolorerserss eerhfre mag.</p> 
 
        </div> 
 
       </div> 
 
      </div> 
 
     </div>

來源

2016-05-17 06:17:21

你寫了一個錯誤的類名

.floatright {float: left;}

你應該使用

.floatleft {float: left;}

來源

2016-05-17 06:20:16

謝謝大家。現在工作很好。這很棒。你們都很棒。我喜歡stackoverflow。如何快速回復這裏！

.floatleft {float: left} 
 
.floatright {float: right} 
 
.colum{width: 1170px; margin: 0 auto;} 
 
.fix {overflow: hidden} 
 
.clear {clear: both}

來源

2016-05-17 06:23:41

向左浮動不起作用

回答

相關問題