Question

我有这个网站：

我想修复这两个div网站，以便排成一行，如下图所示

http://i58.tinypic.com/2n8ucuu.jpg

这是HTML代码：

<footer id="colophon" class="site-footer" role="contentinfo">


            <div class="social-list">

                   <ul>
                      <li><img src="http://eventos.dac-proiect.ro/wp-content/themes/eventos/images/gri1.png" alt="Smiley face" height="30" width="30"></li>
                      <li><img src="http://eventos.dac-proiect.ro/wp-content/themes/eventos/images/gri2.png" alt="Smiley face" height="30" width="30"></li>
                      <li><img src="http://eventos.dac-proiect.ro/wp-content/themes/eventos/images/gri3.png" alt="Smiley face" height="30" width="30"></li>
                      <li><img src="http://eventos.dac-proiect.ro/wp-content/themes/eventos/images/gri4.png" alt="Smiley face" height="30" width="30"></li>
                       <li><img src="http://eventos.dac-proiect.ro/wp-content/themes/eventos/images/gri5.png" alt="Smiley face" height="30" width="30"></li>

                   </ul>

            </div>


    <div class="site-info">


        <?php printf( __( ' © 2015 %1$s %2$s.', 'eventos' ), 'EVENTOS.', 'Toate drepturile rezervate' ); ?>


    </div><!-- .site-info -->
</footer><!-- #colophon -->

我试图在两个网站上放置display：inline-block div，但遗憾的是不起作用......并且不明白为什么

你能帮我解决这个问题吗？

提前致谢！

Answer 1

把浮动：放在你的两个div上并摆脱内联块

Answer 2

footer#colophon > div {
    display: inline-block; /* allow block-level elements to reside on the same line */
    width: 50%;
    box-sizing: border-box; /* make borders and padding part of dimensions */
    font-size: 0; /* eliminate remaining whitespace between */
}

More on dealing with the whitespace niggle

在页脚内排列两个div

2 个答案: