ただいま、こちらを作成しております。(下記画像)
HTMLでリストの2つを同じ行に「左寄せ」「右寄せ」で表示させたいです。
どのように横並びに揃えたらよろしいでしょうか?
よろしくお願いいたします。
・index.html
html
1 2 <!-- SOLTのメンバー --> 3 <div class="members"> 4 <div class="member"> 5 6 <h2>会社名のメンバー</h2> 7 8 <ul class="solt-members"> 9 <li>名前</li> 10 <li>名前</li> 11 <li>名前</li> 12 <li>名前</li> 13 </ul> 14 15 </div> 16 17 <!-- 採用の流れ --> 18 <div class="recruit"> 19 20 <h2>採用選考の流れ</h2> 21 22 <ol> 23 <li>フォームから応募する</li> 24 <li>書類選考</li> 25 <li>面接</li> 26 <li>合否連絡</li> 27 </ol> 28 29 </div> 30 </div>
style.css
css
1body { 2 font-family: sans-serif; 3} 4 5.list { 6 background-color: #c93a40; 7 padding: 20px 0; 8 text-align: center; 9} 10 11.list-item { 12 display: inline; 13 color: white; 14 padding: 0 60px; 15} 16 17.top-img { 18 margin-top: 50px; 19} 20 21.image { 22 width: 100%; 23} 24 25.top-message { 26 border-bottom: 2px solid #999999; 27} 28 29.message-content { 30 margin-left: 15px; 31} 32 33.message-contents { 34 margin-left: 15px; 35} 36 37.member { 38 background-color: #c93a40; 39 padding: 10px 25px; 40} 41 42.recruit { 43 background-color: #c93a40; 44 padding: 10px 25px; 45} 46 47.members { 48 float: left; 49 50}
回答2件
あなたの回答
tips
プレビュー