前提・実現したいこと
ネットにアップしたホームページをスマホのグーグルクロームでページを見るとある一部のページのadding,font-sizeなどのみ動きませんtext-alignなどは動いているみたいです。
教えてください。
ヤフーでは動くみたいです。
同じCSSを読み込んでいます。
文章は恥ずかしいので変更させてください。
発生している問題・エラーメッセージ
エラーメッセージは特にないです。
該当のソースコード
以下HTMLL
<!doctype html> <html lang="ja"> <head> <meta charset="utf-8"> <title>ロシアW杯 2018</title> <link rel="stylesheet" href="index.css"> </head> <body> <img src="pic/top2.png" height="2%" width="40%"> <h1><ol class="topic-path"> <li class="first"><a href="index.html">ホーム</a></li> <li><a href="index5.html">管理者ブログ</a></li> <li><a href="">ロシアW杯 2018</a></li> </ol> </h1> <div id="text"> <h2><b><ロシアW杯 2018></b></h2></br> <p> <img src="pic/status.png" width="70%" height="40%" ></br> ああああ </p> </div> </body> <script></script> </html>以下CSS
html, body, div, span, h1, h2, h3, h4, h5, h6, p, a, img, small, ul, li, article, aside, section, footer, header, nav {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
list-style-type: none;
}
ol.topic-path {
margin: 0; /* マージン(上下左右) /
padding: 0.3% 0.3%; / パディング(上下、左右) /
background-color: #f9f9f9; / 背景色 /
list-style-type: none; / リストマーク非表示 /
font-size: 200%; / 文字サイズ /
}
/ リスト項目 /
ol.topic-path li {
padding-left: 3%; / 左パディング /
display: inline; / 項目を横並び /
}
/ リスト項目(最初の項目) /
ol.topic-path li.first {
padding-left:4%; / 左パディング /
background: url(pic/topic-path-home-gray.png) no-repeat left; / ホーム記号(※) /
}
/ リンクエリア /
ol.topic-path li a {
padding-right: 4%; / 右パディング /
background: url(pic/topic-path-gray.gif) no-repeat right; / 矢印記号(※) /
}
/ リンク色 /
ol.topic-path li a {
color: #4682b4;
}
/ リンク色(マウスオーバー) */
ol.topic-path li a:hover {
color: #79a7cc;
}
#text
{
border:1px solid #000;
box-shadow:inset 4px 4px 4px #999;
margin:9.5% 17%;
padding:4%;
}
#text h2
{
text-align:center;
}
#text p
{
text-align:left;
font-size:1.12em;
font-width:300;}
試したこと
やふーのブラウザでも確認した。
補足情報(FW/ツールのバージョンなど)
サクラエディタ
回答1件
あなたの回答
tips
プレビュー