お世話になります。
iSaraというプログラミングスクールのサイト模写をしている初心者コーダーです。
twitterのシェアボタンとfacebookのシェアボタンを中央に寄せたいのですが、twitterのシェアボタンが左に偏りすぎてバランスが崩れてしまってます。どうすれば2つとも中央に寄せられますか?
iSaraのサイトURL
https://isara.life/
HTML
1<div class="second-section"> 2 <p class="one">まずは20日間で、<br>月10万円稼げるスキルを手にいれよう。</p> 3 <p class="two">※受講料金は実質0円です。詳しくは資料請求をどうぞ。</p> 4 <a href="" class="three">お問い合わせ&資料請求はこちら</a> 5 <p class="four">第4期生:2018年12月3日 ~ 2018年12月22日 *締め切りました</p> 6 <p class="five">第5期生:2019年4月8日 ~ 2019年4月27日 *締め切りました</p> 7 <p class="six">第6期生:資料請求受付中です</p> 8 <div class="SNS_button"> 9 <div class="twitter-button"> 10 <a href="https://twitter.com/share?ref_src=twsrc%5Etfw" class="twitter-share-button" data-show-count="false"> 11 Tweet</a><script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script> 12 </div> 13 <div class="facebook-button"> 14 <div id="fb-root"></div> 15 <script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v3.2"></script> 16 <div class="fb-like" data-href="https://isara.life/" data-layout="standard" data-action="like" data-size="small" data-show-faces="true" data-share="true"></div> 17 </div> 18 </div> 19 </div>
CSS
1.second-section { 2 position: relative; 3 text-align: center; 4 top: 200px; 5 background-color: #EBB94D; 6 padding: 35px; 7} 8 9.second-section .one, 10.second-section .four, 11.second-section .five, 12.second-section .six { 13 color: white; 14} 15 16.second-section p { 17 margin: 0 auto; 18 font-size: 20px; 19 font-weight: bold; 20 text-align: center; 21} 22 23.second-section .three { 24 display: inline-block; 25 font-size: 30px; 26 font-weight: bold; 27 text-decoration: none; 28 margin: 50px auto; 29 background-color: #D84940; 30 padding: 35px 290px; 31 border-radius: 55px; 32 color: white; 33} 34 35.second-section .two { 36 background-color: white; 37 color: #D84940; 38 width: 41%; 39 border-radius: 6px; 40 margin-top: 20px; 41} 42 43.second-section .one { 44 line-height: 35px; 45} 46 47.second-section .four, 48.second-section .five, 49.second-section .six { 50 letter-spacing: 3px; 51 font-size: 20px; 52 line-height: 60px; 53} 54 55.second-section .twitter-button, 56.second-section .twitter-button { 57 float: left; 58 margin-right: 5px; 59}
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
退会済みユーザー
2019/04/24 00:46
退会済みユーザー
2019/04/24 06:32