爲什麼這個按鈕div不會移動到圖像div下方？

-1

I want to move the view more button below the place holders 爲什麼這個按鈕div不會移動到圖像div下方？

HTML：

<section name="middle" id="middle"> 

     <p>Upcoming Events</p> 

     <div class="grid"> 
      <img src="http://placehold.it/350x300" alt="" /> 
      <img src="http://placehold.it/350x300" alt="" /> 
      <img src="http://placehold.it/350x300" alt="" /> 
     </div> 

     <a href="#"> 
      <div class="button-2">View More</div> 
     </a> 
    </section>

CSS：

.button-2 { 
text-align: center; 
top: 0; 
margin: 0 auto; 
width: 200px; 
height: 30px; 
border-style: solid; 
border-width: 2px; 
border-color: #1999f9; 
color: #1999f9; 
padding-top: 10px; 
    transition: background-color 0.5s ease; 
} 


    .grid { 
    position: absolute; 
    top: 150px; 
    height: 50px; 
    bottom: 0; 
    left: 0; 
    right: 0; 
    text-align: center; 
    /* Align center inline elements */ 
} 

.grid img { 
    vertical-align: middle; 
    display: inline-block; 
    padding-left: 10px; 
}

如何我認爲更多的按鈕移動到佔位符下方？這是我的佔位符css也。有沒有解決這個問題的方法？

來源

2016-03-21 SpikeCakes

不能更改標記後移動的按鈕圖像？你能提供上下文和一些代碼嗎？ – fcalderan

嗨，這有幫助嗎？ – SpikeCakes

讓我猜測，你使用的浮動圖像，如果是的話，比你需要清除它們:)更多信息，你可以閱讀我的答案[這裏]（http://stackoverflow.com/questions/16568272/why-沒有高度的容器元素增加，如果它包含浮動el/16568504＃16568504） –

要使用top: 0; left:0您需要在該CSS類中添加position :absolute。這應該現在工作..

其次，BUTTON2應該有底部：0和電網應該有頂：0，如果你想電網出現上述按鈕..

來源

2016-03-21 15:01:05 anshabhi

我已經完成了上述所有操作，但按鈕仍然位於網格後面 – SpikeCakes

爲什麼這個按鈕div不會移動到圖像div下方？

回答

相關問題