CSS创建图像链接彼此相邻

Question

我试图创建一组链接到网站其余部分的一组图标。目前编码都可以正常工作，直到全部四个设置完成，然后只有一个工作。

我正在使用基金会创建一个响应式网站。

<div class="row"> 
      <div class="large-6 large-offset-6 medium-6 medium-offset-6 columns"> 
      <div id="portfolio_link"> 
      <a href="#portfolio_page"> 
       <img src="img/portfolio.png" style="width:80px"> 
      </a> 
      </div> 
      </div> 

      <div class="large-6 large-offset-6 medium-6 medium-offset-6 columns"> 
      <div id="contact_link"> 
      <a href="#contact_page"> 
       <img src="img/Contact.png" style="width:80px"> 
      </a> 
      </div> 
      </div> 

      <div class="large-6 large-offset-6 medium-6 medium-offset-6 columns"> 
      <div id="home_link"> 
      <a href="#home_page"> 
       <img src="img/home.png" style="width:87px"> 
      </a> 
      </div> 
      </div> 

      <div class="large-6 large-offset-6 medium-6 medium-offset-6 columns"> 
      <div id="about_link"> 
      <a href="#about_page"> 
       <img src="img/about.png" style="width:80px"> 
      </a> 
      </div> 
      </div> 

Answer 1

什么是您的列设置在您的_settings.scss？如果你的大6，这将占用你网页的50％。您可以将其中的每一个设置为大3，或将总列数更改为24.

$total-columns: 12;