text-alignのcenterとleftの組み合わせ方法がわかりません。
上側のpタグはできたのですが。。。
それと、もしよろしければもっと短いコードの書き方や、綺麗でスマートな書き方があれば教えて頂けると助かります。どうぞ宜しくお願いします。
HTML
<section> <div id="text"> <div class="title">旅に出よう。</div> <div class="top-text"> <div class="top-text-inside"> <p >僕たちが作りたいのは<br>持っているだけで旅に出たくなるモノ。<br>持っているだけでわくわくするモノ。</p> <p>それは新しい時代の “パスポート”<br>僕たちが作るものは、<br>そんな、存在でありたい。</p> <p>そして、人と人が繋がる<br>こんな時代だからこそ、<br>僕たちは、みんなでひとつのモノを<br>作ることを追求したい。</p> </div> </div> <div class="top-img"> <img src="img/top-logo.png" alt=""> </div> <div class="main"> <p class="main1">それは、自分と世界を繋げる<br>旅のモノづくりブランド</p> </div> </div> </section>CSS
- {
margin: 0;
padding: 0;
}
#text {
width: 90%;
margin: auto;
}section {
height: 100vh;
background-color: #ccc;
}
section img {
width: 200px;
display: block;
margin: auto;
}
section p {
font-size: 20px;
line-height: 34px;
padding: 20px;
}
.title {
font-size: 44px;
line-height: 75px;
text-align: center;
padding: 40px;
}
.top-text {
text-align: center;
}
.top-text-inside {
text-align: left;
display: inline-block;
}
.main {
text-align: center;
}
.main1 {
text-align: left;
display: inline-block;
}
回答1件
あなたの回答
tips
プレビュー