Q&A
こちら頂いたコードでは再現いたしませんでした。
reset.cssに問題はございませんでしょうか？
header,footerが最初に100pxだったのを10pxにし、floatによるレイアウト崩れを直すために
clearタグを設定しましたが、CSSが反映されません
ブラウザはchromeでエディタはatomです chromeの方で履歴を削除したり、F5ボタンを押したりしましたが改善されません
HTML
1<!DOCTYPE html> 2<html lang="ja" > 3 <head> 4 <meta charset="utf-8"> 5 <title></title> 6 <link rel="stylesheet" href="reset.css"> 7 <link rel="stylesheet" href="style.css"> 8 </head> 9 <body> 10 <header class="header"> 11 </header> 12 <div class="wrapper"> 13 <main class="main"> 14 </main> 15 <div class="sidemenu"> 16 </div> 17 <div class="clear"> 18 </div> 19 </div > 20 <footer class="footer"> 21 </footer> 22 </body> 23</html>
CSS
1.header{ 2width: 100% 3} 4.wrapper{ 5width:970px; 6margin:30px auto 40px; 7} 8.main{display:block; 9float:left; 10width:660px; 11} 12.sidemenu{ 13float:right; 14width:275px; 15} 16.footer{ 17width:100%; 18} 19.header, .main, .sidemenu, .footer{background-color:#ccc;} 20.header, .footer{height:10px;} 21.main, .sidemenu{height:500px;} 22.clear{clear: both;}
resetCSS
1/** 2 * html5doctor.com Reset Stylesheet v1.6.1 (http://html5doctor.com/html-5-reset-stylesheet/) 3 * Richard Clark (http://richclarkdesign.com) 4 * http://cssreset.com 5 */ 6html, body, div, span, object, iframe, 7h1, h2, h3, h4, h5, h6, p, blockquote, pre, 8abbr, address, cite, code, 9del, dfn, em, img, ins, kbd, q, samp, 10small, strong, sub, sup, var, 11b, i, 12dl, dt, dd, ol, ul, li, 13fieldset, form, label, legend, 14table, caption, tbody, tfoot, thead, tr, th, td, 15article, aside, canvas, details, figcaption, figure, 16footer, header, hgroup, menu, nav, section, summary, 17time, mark, audio, video { 18 margin:0; 19 padding:0; 20 border:0; 21 outline:0; 22 font-size:100%; 23 vertical-align:baseline; 24 background:transparent; 25} 26body { 27 line-height:1; 28} 29article,aside,details,figcaption,figure, 30footer,header,hgroup,menu,nav,section { 31 display:block; 32} 33nav ul { 34 list-style:none; 35} 36blockquote, q { 37 quotes:none; 38} 39blockquote:before, blockquote:after, 40q:before, q:after { 41 content:''; 42 content:none; 43} 44a { 45 margin:0; 46 padding:0; 47 font-size:100%; 48 vertical-align:baseline; 49 background:transparent; 50} 51/* change colours to suit your needs */ 52ins { 53 background-color:#ff9; 54 color:#000; 55 text-decoration:none; 56} 57/* change colours to suit your needs */ 58mark { 59 background-color:#ff9; 60 color:#000; 61 font-style:italic; 62 font-weight:bold; 63} 64del { 65 text-decoration: line-through; 66} 67abbr[title], dfn[title] { 68 border-bottom:1px dotted; 69 cursor:help; 70} 71table { 72 border-collapse:collapse; 73 border-spacing:0; 74} 75/* change border colour to suit your needs */ 76hr { 77 display:block; 78 height:1px; 79 border:0; 80 border-top:1px solid #cccccc; 81 margin:1em 0; 82 padding:0; 83} 84input, select { 85 vertical-align:middle; 86} 87
キャッシュクリアやスーパーリロード、シークレットウインドウでの表示は試しましたか？
キャッシュクリア、スーパーリロード、シークレットウィンドウ
3つとも試しましたが、変わりませんでした
resetCSSは何もいじっていないので、特に問題はないと思います
tomtomtomtomさん同様、質問に提示のコードだけでは状況が再現できませんでした。
きちんと保存ができているか、編集しているものと表示されているものが同じファイルかなどもご確認ください。
（文字を変更したり高さ以外のわかりやすい部分を変更してみてください。背景色など）
デベロッパーツールなどを使って、どのスタイルが適用されているのかも確認してください。
あれからわかったのですが編集しているものと表示されているのが違うファイル
でした
お騒がせしました ありがとうございます
回答1件
0
自己解決
編集中のファイルと表示されているファイルが異なっていた
CSSの反映はきちんとなされていました
投稿2020/12/18 05:39
総合スコア28
あなたの回答
tips
プレビュー
