1
私は、異なる3つの異なる<div>sの間にスペーシングを作成しようとしています。私はthis answerに従ってみましたが、なんらかの理由で何らかの理由で私は悪い結果を得ています：同じ行内に複数のディビジョン/セクションを配置する方法
また、私は3つのセクションを彼がその記事にしたいと思うように均等に配置しようとしていません。スクロールのための「ゲートウェイのWebデザイン応答ウェブサイト」のための1つ、ソーシャルメディアのリンクのための1つ、および1 - だから私は3つの別々のセクションを持っている必要があり
：これは私が行くよまさにです上の矢印に移動します。ここに私のコードです：
HTML：
</body>
<footer>
<div class="footer-row">
<div class="responsive-website-by">
<p>Responsive Website by <a href="http://www.gatewaywebdesign.co.uk/" target="blank">
Gateway Web Design</a>
</p>
</div>
<div id="social-links">
<a href="http://youtube.com" target="blank">
<i class="fa fa-youtube" style="font-size: 24px"></i>
</a>
<a href="http://instagram.com" target="blank">
<i class="fa fa-instagram" style="font-size:24px"></i>
</a>
<a href="http://twitter.com" target="blank">
<i class="fa fa-twitter" style="font-size:24px"></i>
</a>
<a href="http://facebook.com" target="blank">
<i class="fa fa-facebook" style="font-size:24px"></i>
</a>
</div>
<div id="scroll-to-top">
<button id="scroll-to-top-icon" onclick="scrollToTop(1000);">^</button>
</div>
</div>
</footer>
<?php wp_footer(); ?>
</html>
CSS：
/* FOOTER */
footer {
background-color: #000000;
height: 55px;
}
.footer-row {
display: table;
width: 100%; /*Optional*/
table-layout: fixed; /*Optional*/
border-spacing: 10px; /*Optional*/
}
#social-links {
padding-right: 40px;
display: table-cell;
}
#social-links a {
color: white;
float: right;
text-decoration: none;
margin: 20px;
margin-top: 15px;
}
#social-links a:hover {
color: #966948;
transition: all 0.2s ease-in-out;
}
.responsive-website-by {
color: #BCBEC0;
float: left;
padding-left: 40px;
padding-top: 3px;
display: table-cell;
}
.responsive-website-by a{
color: white;
text-decoration: none;
}
.responsive-website-by a:hover{
color: #966948;
text-decoration: none;
transition: all 0.2s ease-in-out;
}
#scroll-to-top {
float:right;
display: table-cell;
}
#scroll-to-top-icon {
background-color: #966948;
border: none;
font-size: 35px;
height: 30px;
width: 34px;
padding-bottom: 31px;
}
空間にできないだけでなく、それらうちは私が水平に好きな方法、私は彼らがしている理由を理解していませんまた、フッターの外側に押し下げられます。私はそれらのセレクタのマージン/パディングをコメントアウトしようとしたが、問題はまだ残っ：
を助けてください！ありがとうございました。
EDIT：
あなたは、他のdivが押し下げされているか言及しないresponsive-website-by div要素が自動的にフッタ内押し下げられている。このスクリーンショットで見ることができます - なぜ？
[fiddle]（http://jsfiddle.net）を作成できますか？ –
@ iuliu.netしばらくお待ちください....上記の編集をご覧ください。 – HappyHands31
Js Fiddle Link：https://jsfiddle.net/jn32sxjr/1/。それはフィドルがフォントのすばらしいアイコンをサポートしていないように見えたので、私はイニシャルをそれぞれのイニシャルに置き換えました。 – HappyHands31