为什么我的文本没有在我的外部分区中浮动？

Question

As you see in my code, my items(I mean, Links division) does not, float right in the outer division(I mean, PopularSearch division), the styles for both division, are shown below.

 .PopularSearch { width: 80%; height: 80px; float: right; margin-right: 120px; margin-top: 50px; margin-bottom: 50px; border: 1px solid black; }.Links { width: 80px; height: 45px; float: right; border-radius: 3px; border: 5px solid #00d363; }

 <div class="PopularSearch"> <div class="links">خلاقیت</div> <div class="links">فروش</div> <div class="links">مدیریت</div> <div class="links">ایده</div> <div class="links">نرم افزار</div> </div>

Answer 1

This is because the class for the divs is "links" but the css is trying to add style to the class name of "Links" with a capital L. And lower and capital cases do matter in html therefore "links" will not equal to "Links."

 As you see in my code,my items(I mean,Links division) does not,float right in the outer division(I mean,PopularSearch division),the styles for both division,are shows below. .PopularSearch { width: 80%; height: 80px; float: right; margin-right: 120px; margin-top: 50px; margin-bottom: 50px; border: 1px solid black; } /* lowered the case for "L" */.links { width: 80px; height: 45px; float: right; border-radius: 3px; border: 5px solid #00d363; }

 <div class="PopularSearch"> <div class="links">خلاقیت</div> <div class="links">فروش</div> <div class="links">مدیریت</div> <div class="links">ایده</div> <div class="links">نرم افزار</div> </div>