向左浮动不起作用

我是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

向左浮动不起作用

回答

相关问题