前提・実現したいこと
div以下の文章を表示させたい
発生している問題・エラーメッセージ
divタグ以下の文章が表示されない
該当のソースコード
HTML5
1<!DOCTYPE html> 2<html lang="ja"> 3 <head> 4 <meta charset="utf-8"> 5 <title>WCB Cafe</title> 6 <meta name="description" content="ブレンドコーヒーとヘルシーなオーガニックフード 7 を提供するカフェ"> 8 9 <!-- CSS --> 10 <limk rel="stylesheet" href="https://unpkg.com/ress/dist/ress.min.css"> 11 <link href="https://fonts.googleeapis.com/css?family=Philosopher" rel="stylesheet"> 12 <link href="css/style.css" rel="stylesheet"> 13 14 15 </head> 16 17 <body> 18 <header class="page-header wrapper"> 19 <h1><a href="index.html"><img class="logo" src="images/logo.svg" alt="WCBカフェ ホーム"></a></h1> 20 <nav> 21 <ul class="main-nav"> 22 <li><a href="news.html">News</a></li> 23 <li><a href="menu.html">Menu</a></li> 24 <li><a href="contact.html">Contact</a></li> 25 <ul> 26 </nav> 27 </header> 28 29 <div class="home-content wrapper"> 30 <h2 class="page-tytle">We'll Make Your Day</h2> 31 <p>おしゃれなカフェで癒されてみませんか?無添加の食材で体の中からリフレッシュ。</p> 32 <a class="button" href="menu.html">メニューを見る</a> 33 </div><!--/.home-content --> 34 </body> 35 36 37 </html> 38
試したこと
コードの確認・対処法の検索
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
CSSの問題の可能性もあるので(というより可能性が高いかと)CSSも提示して頂けると幸いです。
わかりました。
@charset "UTF-8";
/* 共通部分
------------------------------- */
html {
font-size: 100%;
}
body{
font-family: "Yu Gothic Medium", "游ゴシック Medium", YuGothic, "游ゴシック体", "ヒラギノ角ゴ Pro W3", sans-serif;
line-height: 1.7;
color: #432;
}
a {
text-decoration: none;
}
img {
max-width: 100%;
}
.logo{
width:210px;
margin-top: 14px;
}
.main-nav{
display: flex;
font-size: 1.25rem;
text-transform: uppercase;
margin-top: 34px;
list-style: none;
}
.main-nav li{
margin-left: 36px;
}
.main-nav a{
color:#432;
}
.main-nav a:hover{
color:#0bd;
}
.page-header{
display: flex;
justify-content: space-between;
}
.wrapper{
max-width: 1100px;
margin: 0 auto;
padding: 0 4%;
}
.home-content{
text-align:center;
margin-top: 10%;
}
.home-content p{
font-size: 1.125rem;
margin:10px 0 42px;
}
回答2件
あなたの回答
tips
プレビュー