実際に遭遇した例2.「CSSセレクタ{プロパティ名：値}」とすべきところを「CSSセレクタ{プロパティ名：値]」と記述

Webデザイン

→ → → Entries ← ← ←
カテゴリー: CSS 　閲覧数:867　配信日:2017-07-14 08:52


問題発生


レイアウトが崩れまくっている
・位置ずれ
・フォントサイズが勝手に変更されている
・「兄弟要素の兄要素を選択出来ない」ため、無理やり記述した内容がイケなかったの？
em{

  font-style:normal;

  font-weight:bold;

}



/* テーブル直前のpタグを選択出来ないので */

section table{margin-top:-1rem;]


疑った内容


sectionタグは指定できない？
・sectionタグ内にあるtableタグは指定できない？
・そんなはずないよね？

原因判明


「}」と記述すべきところを「]」と記述していたから

週間人気ページランキング ／ 9-25 → 10-1
順位 ページタイトル抜粋 アクセス数
1 Design 0 9
2 「コズミックブルー」は、くすんだ青系全般の色を指す用語だと思います。 | カラーコード(色) 4
2 「東京都」のカラーコード取得は難しい | カラーコード(色) 4
3 RGBの種類 ／ ビットカラー | RGB(色) 3
3 Fireworks で背景画像透明化 | Fireworks CS3(Fireworks) 3
3 Chromeブックマーク(ブラウザ) カテゴリー 3
3 ケルビン（kelvin）／ 記号K 3
3 FontAwesomeでアイコンが□（四角）になって表示されない　Forbidden　 | Font Awesome(フォント) 3
3 ログイン 3
3 スキップリンク | アクセシビリティ(UI) 3
3 RGB ⇔ Lab | 色変換(色) 3
4 Uncaught Error: Bootstrap tooltips require Tether (http://github.hubspot.com/tether/) | 4系(Bootstrap) 2
4 「ホーム」に統一 | 他サイト調査(HTML) 2
4 HTMLエディタ カテゴリー 2
4 HSLとHSVの違い | 色変換(色) 2
4 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 2
4 レスポンシブ画像(レスポンシブ) カテゴリー 2
4 ブラウザ間差異とか、もううんざりなんだけど… 2
4 align-items: center; 2
5 「display」効果を打ち消すスタイルシートは、存在しない 1
2026/10/2 5:05 更新
指定期間人気ページランキング ／ 2020-5-30 → 2026-10-1
順位 ページタイトル抜粋 アクセス数
1 RGB ⇔ Lab | 色変換(色) 8953
2 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 4635
3 Design 0 4267
4 血の色 ／ #b30000 ／ #360800 ／ #ff0000 | カラーコード(色) 3806
5 RGBの種類 ／ ビットカラー | RGB(色) 2840
6 Windows10で「Google Chrome」が常に最前面に表示される。「アクティブウィンドウ」が最前面で表示されない → 解決方法存在しない | Google Chrome(ブラウザ) 2807
7 「bgcolor」「background-color」「background」の違い | CSS 2117
8 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 2106
9 金融機関ブランドカラー ／ コーポレートカラー | カラーコード(色) 2002
10 「コズミックブルー」は、くすんだ青系全般の色を指す用語だと思います。 | カラーコード(色) 1911
11 16進数カラーコード ／ 2進数 1898
12 「:hover」「z-index」を組み合わせて使用すると、正常動作しないことがある | z-index(CSS) 1733
13 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 1709
14 「属性」「プロパティ」「アトリビュート」の違い | CSS 1699
15 「パッケージ化されてない拡張機能を読み込む」でインストールした拡張は、chromeを「更新」すると正常動作しなくなることがあります。 | Chrome 拡張機能(ブラウザ) 1580
16 「Bootstrapデザイン」✕「グラフ」 | 2系(Bootstrap) 1549
17 「東京都」のカラーコード取得は難しい | カラーコード(色) 1498
18 Chrome でキャッシュを効かさない | Google Chrome(ブラウザ) 1404
19 「西武鉄道株式会社」のブランドカラーは、3色(#3366CC、#66CCFF、#33CC66) | 色 1268
20 「Chrome拡張機能」開発中に遭遇したエラー | Chrome 拡張機能 1257
2026/10/2 5:05 更新