CSS

一覧 ＞ メインカテゴリ … 133 エントリー

z-index(3)　／　擬似(8)　／　Flexible Box Layout Module(5)　／　Backgrounds and Borders Module(4)　／　CSSハック(1)　／　CSSセレクタ(2)　／　数値データ型(3)　／　CSSトラブル対応(11)　／　position(5)　／　フォーム(3)　／　単位(2)


CSSがどうしても効かない → 該当CSSの読込可否 → 該当CSSの反映可否

CSSトラブル対応

6

2020-04-07 更新

29,841 Views

「マウスオーバー」「ロールオーバー」「ホバー」の違い

CSS

3

2013-03-27 更新

25,572 Views

「z-index」が効かない時は「-1」を指定してみる

z-index

2015-01-02 更新

20,575 Views

使用していないCSSをチェックする、標準的な方法を知りたい

CSS

試行錯誤履歴

4

2020-07-06 更新

20,202 Views

効果を打ち消すスタイルシート

CSS

11

2015-06-16 更新

16,363 Views

ページ内リンクの位置を微調整するためには、Negative margin を使用する

CSS

試行錯誤履歴

2

2019-10-09 更新

15,330 Views

背景画像がどうしても表示されない → 「clear:both;」を挿入してみる

CSSトラブル対応

2017-10-29 更新

14,388 Views

aタグで複数のブロック要素を囲むやり方

CSS

不明

2011-02-21 更新

13,929 Views

「bgcolor」「background-color」「background」の違い

CSS

3

2017-11-21 更新

12,330 Views

「a:before:hover」ではなく「a:hover:before」

擬似

2

2017-02-05 更新

11,595 Views

「max-width:100%;」と「width : 100%;」の違い

CSS

2

2017-05-29 更新

11,093 Views

invalid property value css background-color

CSS

2013-02-12 更新

10,913 Views

height:100%;の効果を打ち消す(あるいは上書きする)には、height:auto!important;

CSS

不明

2011-05-28 更新

9,982 Views

「属性」「プロパティ」「アトリビュート」の違い

CSS

2

2015-12-31 更新

9,704 Views

IE8で、フォームの縦位置がどうしても真ん中にこない場合の、最後の手段(案)

フォーム

試行錯誤履歴

2019-10-03 更新

8,582 Views

CSSだけでボーダーを内側に引く

Backgrounds and Borders Module

2

2016-01-13 更新

8,115 Views

プルダウンメニュー（セレクトボックス）要素を右揃えしようと思ったけど、出来なかったのでメモ

CSS

不明

2011-07-31 更新

8,028 Views

レイアウトがどうしても崩れるときは、div marginへマイナス値が設定されていないか、確かめる

CSS

2013-01-30 更新

7,939 Views

サイトにプログラムコードを貼り付ける preタグのCSS

CSS

2018-04-13 更新

7,743 Views

インライン要素のまま、上下marginを適用させる

CSS

3

2013-03-14 更新

7,483 Views

親要素の背景色を、CSSで打ち消したい

CSS

2

2013-03-20 更新

7,375 Views

「リキッド」とか「グリッド」とか

CSS

不明

2011-09-02 更新

7,089 Views

親要素の横幅を越えたヘッダー／レスポンシブ対応

CSS

3

2015-06-08 更新

6,868 Views

IE8とFireFox3.0.9　テーブルボーダー表示が異なる

CSS

不明

2011-02-20 更新

6,745 Views

早見表

CSS

2014-05-06 更新

6,723 Views

ドキュメントルート外のCSSファイル読込。～ 2018年

CSS

試行錯誤履歴

8

2019-10-21 更新

6,696 Views

「:hover」「z-index」を組み合わせて使用すると、正常動作しないことがある

z-index

未解決

4

2015-01-02 更新

6,655 Views

CSS3で背景色にグラデーションをつける

CSS

2

2013-04-03 更新

6,619 Views

max-width: 100%の効果を打ち消すには、max-width: none;

CSS

2

2013-04-13 更新

6,527 Views

「:after擬似要素」は、Chromeの「要素を検証」で確認できない

擬似

2015-09-16 更新

6,403 Views

CSS最適化／CSS整形

CSS

不明

2011-08-06 更新

6,377 Views

trタグに背景色

CSS

不明

2011-12-27 更新

5,961 Views

positionプロパティのrelative指定は、デフォルトではない

CSS

2013-11-09 更新

5,431 Views

IE改行対策

CSS

2014-05-12 更新

5,343 Views

リストタグではない、リスト内画像の縦位置調整

CSS

不明

2011-07-08 更新

5,070 Views

CSSのみで交互色 … リスト

CSS

2013-01-04 更新

4,654 Views

「Invalid property value.」遭遇事例一覧

CSS

2015-05-24 更新

4,646 Views

divタグがdisplay:block;とかしても、ブロック要素にならないときは、

CSS

不明

2012-01-21 更新

4,512 Views

CSS選択範囲非表示対応

CSS

2

2013-03-25 更新

4,288 Views

rem

単位

2

2020-05-18 更新

4,119 Views

CSSで画像をロールオーバー

CSS

2014-03-27 更新

4,095 Views

HTML5では、inputタグの閉じタグを付与しない

CSS

2013-05-11 更新

4,048 Views

olタグ装飾しようとしたら、「レスポンシブ」と「広告」影響により挫折

CSS

挫折により終了

2

2013-02-20 更新

4,033 Views

CSSで、1行テキストを縦中央（垂直）に配置

CSS

2013-06-14 更新

3,830 Views

画像の上にテキスト表示

CSS

調査中

2014-03-30 更新

3,478 Views

「position:absolute;」指定する際は、必ず(親要素を含む)祖先要素の何れかで「position」を明示的に指定

position

2018-01-14 更新

3,444 Views

ボタンクリック出来ない → 「display-inline;」を「display:inline-block;」へ変更

CSSトラブル対応

2017-10-29 更新

3,414 Views

box-sizingは危険なCSS ／ レイアウトや位置がどうしても意図した通り設定できない場合は、box-sizingを疑う

CSS

4

2016-07-11 更新

3,404 Views

CSSで出来ないこと

CSS

結論(後で見返す用)

2020-04-05 更新

3,352 Views

trタグにborder

CSS

2013-01-23 更新

3,342 Views

複数CSSファイルを、PHPを利用して1ファイルにする。～ 2018年

CSS

試行錯誤履歴

3

2019-10-14 更新

3,293 Views

position:absolute→relative不具合

position

2

2018-01-14 更新

3,284 Views

100/7%ではなく100%/7。(100/7)%ではなく(100%/7)

CSS

2018-04-15 更新

3,245 Views

半透明borderは、16進数カラーコードではなくRBGAを使用

Backgrounds and Borders Module

2016-01-13 更新

3,111 Views

Modernizr

CSS

2013-04-03 更新

3,062 Views

Firebug過信は危険

CSS

不明

2011-12-08 更新

3,022 Views

CSSセレクタ

CSSセレクタ

4

2017-01-27 更新

3,013 Views

CSS3では指定子要素を持つ親要素は選択不可だが、指定親要素を持つ子要素は選択可能

CSS

3

2015-07-13 更新

3,006 Views

「transform:translate3d();」でスマホ実機画面が一瞬だけチラつく → 「backface-visibility:hidden;」指定すると解消される

CSSトラブル対応

2017-10-30 更新

2,954 Views

「レイアウト崩れ」がどうしても解決しない → Chrome「デベロッパーツール」で怪しいと思った要素を、正常表示されるまで削除し続けていく

CSSトラブル対応

2017-10-29 更新

2,937 Views

背景画像を要素幅一杯に広げ、リサイズにも対応させる

CSS

2013-07-27 更新

2,898 Views

擬似要素

CSS

2014-04-01 更新

2,845 Views

display:none ／ visibility:hidden

CSS

2

2017-11-01 更新

2,843 Views

テーブル枠線がどうしても消えない時は「border-collapse: collapse;」

Backgrounds and Borders Module

2018-03-01 更新

2,823 Views

ChromeでCSSを確認する4つの方法

CSS

未解決

2

2013-10-25 更新

2,712 Views

CSS3擬似要素 (Pseudo-elements)ダブルコロン:: ／ CSS3擬似クラス (Pseudo-classes)シングルコロン:

擬似

2015-09-16 更新

2,707 Views

横一列 ／ display:flex;

Flexible Box Layout Module

4

2017-01-10 更新

2,551 Views

「position:absolute;」が分からなくなったときに見るエントリー

position

2018-02-01 更新

2,496 Views

CSSだけで、任意の要素に配置した画像を画面一杯に表示することは、基本的には出来ない。「img src」「背景画像」「div要素」何れの場合でも。可能なのは、特殊な要件が重なった場合だけ

CSS

4

2017-03-23 更新

2,418 Views

指定兄弟要素(h1～h5タグ何れか)のmarginを取得して、指定要素に適用させたい

CSS

3

2016-11-12 更新

2,412 Views

resizeプロパティ

CSS

2

2017-07-11 更新

2,411 Views

数値データ型 ／ Numeric Data Types

数値データ型

2016-05-11 更新

2,400 Views

resizeが効かない場合は、min-heightを設定してみる

CSS

調査中

2015-06-14 更新

2,387 Views

ページで使用されている「id名」「class名」をChromeで取得したい 　

CSS

試行錯誤履歴

3

2019-10-14 更新

2,373 Views

「display:flex;」を設定している「<li>タグ」内の「<a>タグ」クリック範囲を拡大する

Flexible Box Layout Module

結論(後で見返す用)

2

2019-11-11 更新

2,372 Views

擬似クラス（Pseudo-classes）

擬似

2015-09-16 更新

2,370 Views

「align-items: center;」「align-self: center;」「align-content: center;」の違い

Flexible Box Layout Module

2

2017-12-27 更新

2,324 Views

上下中央揃え。要素の「幅」や「高さ」指定不要 ／ div { height: 100%; display: flex; justify-content: center; align-items: center; }

CSS

2017-01-01 更新

2,323 Views

CSS Flexible Box Layout Module Level 1

Flexible Box Layout Module

6

2016-01-13 更新

2,301 Views

aタグのクリック範囲を、囲っているタグ範囲まで拡大する

CSS

2018-03-05 更新

2,300 Views

borderプロパティでは、線のスタイル・太さ・色について上下左右バラバラの指定を一括することは出来ない

Backgrounds and Borders Module

2017-11-27 更新

2,278 Views

「z-index」が効かない時は？ ／ 「position:relative」を指定してみる ／ 「z-index:-1」を指定してみる

z-index

2017-03-23 更新

2,183 Views

要素毎に順番で背景色変更

擬似

2017-12-27 更新

2,166 Views

hrタグにはwidth指定可能。点線にして左端に寄せる

CSS

結論(後で見返す用)

2023-02-13 更新

2,139 Views

単位

単位

2020-03-16 更新

2,127 Views

perspectiveのベンダープレフィックスを自動付与したい

CSS

2015-05-24 更新

2,100 Views

単位をもつ数字：ディメンション ／ Numbers with Units: dimensions

数値データ型

2016-05-10 更新

2,091 Views

「兄弟要素の兄要素を選択するCSSセレクタ」は存在しない

CSSセレクタ

2017-07-13 更新

2,089 Views

Private リセットCSSテンプレ ／ CSS圧縮Link

CSS

結論(後で見返す用)

2020-02-14 更新

2,054 Views

@media screen and (min-width: 0\0) { ／ アットメディアゼロハック（IE9、IE10）／ Bootstrap4

CSSハック

2016-03-12 更新

2,052 Views

CSS Transforms Module Level 1

CSS

調査中

2015-10-22 更新

2,024 Views

CSS仕様書

CSS

2016-05-31 更新

2,024 Views

レスポンシブスマホサイトで、意図せず横スクロールが発生する場合は、URLを折り返し表示するよう設定

CSS

2017-05-29 更新

2,016 Views

ボタンクリックした際、テキスト選択状態になるのを防止するためには、「user-select: none;」

CSS

2017-06-03 更新

2,010 Views

<input>タグの"submit"属性の見た目を、CSSで変更しようとしてハマる

フォーム

試行錯誤履歴

2

2019-10-03 更新

1,984 Views

擬似要素（Pseudo-elements）

擬似

2015-09-16 更新

1,950 Views

textareaのスクロールバーが横へはみ出す場合は、「box-sizing:border-box;」を指定する

CSS

2020-07-03 更新

1,926 Views

数値データ型階層構造

数値データ型

2016-05-12 更新

1,904 Views

指定要素の(内容で)2番目以降最後まで。要素:nth-of-type(n+2)

擬似

2017-11-20 更新

1,901 Views

margin相殺 ／ 水平方向では発生しない。「position:absolute;」「position:fixed;」指定した要素では全く発生しない

CSS

2018-05-13 更新

1,877 Views

「display:flex;」と記述するだけで有効 → 「flex-basis:auto; flex-direction:row; flex-grow:0; flex-shrink:1; flex-wrap:nowrap;」

Flexible Box Layout Module

2017-01-10 更新

1,852 Views

CSSでループ処理。一定間隔で(背景色等を)繰り返し指定する

CSS

結論(後で見返す用)

2

2024-02-28 更新

1,845 Views

縦中央配置するには、親要素に2行追加。display: flex; align-items: center;

CSS

2018-06-15 更新

1,832 Views

フォーム要素に対する(私の)CSS適用ルール

フォーム

結論(後で見返す用)

2019-10-03 更新

1,758 Views

階層表示 ／ ウィキペディア（Wikipedia）方式

CSS

2017-12-31 更新

1,744 Views

display:flexのorderプロパティを使用すると、「:first-child」「:last-child」「隣接兄弟結合子」の効果は上書きされる

CSS

2020-04-24 更新

1,711 Views

プロジェクト別CSSリファクタ履歴

CSS

試行錯誤履歴

2019-10-03 更新

1,654 Views

「要素{position:absolute;}親要素{position:absolute;}」と「要素{position:absolute;}親要素{position:relative;}」の違い

position

2018-01-14 更新

1,645 Views

隣接兄弟結合子{h1 + p}と、一般兄弟結合子{h1 ~ p}では、意味が異なります。 直後にある要素を選択は、隣接兄弟結合子{h1 + p}です。

CSS

結論(後で見返す用)

2

2023-02-13 更新

1,560 Views

CSSは、//でコメントアウトできない。1行でも複数行でも、構文は、/* コメント */ のみ

CSSトラブル対応

2020-02-29 更新

1,482 Views

既存サービスのCSSがどうしても効かない → 正常動作する最小構成の単体デモを作成し、移し替える

CSSトラブル対応

2

2020-04-12 更新

1,455 Views

「position:sticky;」がどうしても効かない → <header>を一旦削除してみる → <header>に「display:inline;」を指定

CSSトラブル対応

2

2020-04-07 更新

1,432 Views

position:absolute; 1.要素のためのスペースを確保しない。2.要素位置を、位置指定された祖先要素のうち最も近いもの、もしくは、その要素の初期包含ブロックを基準にして決定。3.絶対位置指定されたボックスのマージンは、他要素マージンと相殺しない

position

2

2018-02-05 更新

1,432 Views

SVGの色指定は、「枠線 stroke」と「内部 fill」の2種類

CSSトラブル対応

2022-03-19 更新

1,337 Views

「:first-child」が効かない場合は「:first-of-type」

CSSトラブル対応

2022-03-19 更新

1,293 Views

「.hoge h4:before:nth-child(5n+1)」ではなく「.hoge h4:nth-child(5n+1):before」

擬似

2

2021-07-06 更新

1,206 Views

「正常動作する最小構成単体デモ」と挙動が異なる理由は、<div><div>の処理方法が、htmlの複雑さで異なるから

CSSトラブル対応

2021-05-26 更新

1,168 Views

レスポンシブの margin と width 設定

CSS

2022-09-14 更新

1,104 Views

「display:inline-block;」指定した要素の直後を改行するためには、「display:inline-block;」自体を「display:table;」へ変更します。

CSS

結論(後で見返す用)

2023-12-21 更新

1,006 Views

「position:fixed;」指定した要素を中央寄せするためには、「left:50%;transform:translateX(-50%);」を追記します。

CSS

2023-02-03 更新

1,004 Views

CSSで直前の要素を取得するセレクタはない。ので、直後の要素を取得してマイナス設定値を指定しました。

CSS

2023-01-17 更新

978 Views

「隣接する直前要素」で「最初の要素以外」を指定するCSSセレクタは、囲う要素 直前要素:not(:first-child):has(+ 直後要素){}

CSS

結論(後で見返す用)

2023-12-23 更新

869 Views

「直後が A 要素 でない B 要素」を指定するCSSセレクタは、「A:not(:has(+ B)) {}」

CSS

結論(後で見返す用)

2

2024-11-30 更新

826 Views

チェック柄　斜め線

CSS

2024-06-06 更新

671 Views

HTMLタグに直接訪問済みリンクの色を指定することはできません。リンクのスタイルを変更するには、CSSを使用する必要があります。<style>タグを使わずにCSSを適用する方法として、インラインスタイルを使用することができますが、訪問済みリンクの色をインラインスタイルで指定することはできません。

CSS

2

2024-08-30 更新

513 Views

直前の要素、直後の要素

CSS

結論(後で見返す用)

2025-01-01 更新

495 Views

UIランキング。パーツ選択候補 ／ Topナビゲーション ／ Bottomナビゲーション ／ グリッド ／ 組積造 ／ コンテンツタブ切替 ／ テーブル ／ フォーム ／ ボタン

CSS

4

2019-11-11 更新

102 Views

画像生成AI

CSS

未解決

2

2024-10-24 更新

1 Views

背景CSS シームレスパターン

CSS

2020-04-20 更新

0 Views

Design系Link

CSS

2020-04-30 更新

0 Views

アイコンアニメーション化

CSS

2022-10-24 更新

0 Views

個人的によく見返すエントリーへの非公開Link

CSS

結論(後で見返す用)

2024-03-06 更新

0 Views

背景斜め灰色白ストライプ線

CSS

2025-01-27 更新

0 Views

週間人気ページランキング ／ 4-11 → 4-17
順位 ページタイトル抜粋 アクセス数
1 Design 0 21
2 「Default User」を削除したら、既存ブックマークが削除されてしまった！ 18
3 Chromeシークレットモードで、ウインドウ幅をリサイズしようとすると、下限制限を受ける | Google Chrome(ブラウザ) 16
4 Material Design 2014 年 | Material Design(色) 15
5 Illustratorでaiファイルを保存する際、下位バージョンでも開けるよう保存する | Illustrator CS3(Illustrator) 14
6 Adobe Camera Raw 4.0 | Photoshop 13
6 拡張機能が Chrome によって無効にされました ／ この拡張機能は破損している可能性があります。 | Chrome 拡張機能 13
7 CSSだけで、任意の要素に配置した画像を画面一杯に表示することは、基本的には出来ない。「img src」「背景画像」「div要素」何れの場合でも。可能なのは、特殊な要件が重なった場合だけ | CSS 10
8 「.aiファイル」を下位バージョンで保存するための操作手順 ／ OS 上で「.aiファイル」から「作成したIllustratorバージョン」を確認する方法 ／ 下位バージョンのIllustratorで開く方法 9
9 「東京都」のカラーコード取得は難しい | カラーコード(色) 8
9 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 8
10 Photoshop無料アクションファイル(atn)導入見送り | Photoshop 7
11 キャラクター無料作成ジェネレーター ／ FLASH ／ オンラインサービス | イラスト参考(デザイン) 5
11 「文春オンライン」に掲載されている画像を「Google Chrome」ブラウザでダウンロードするためには、chrome拡張機能「Absolute Enable Right Click & Copy」を使用します。 | 画像 5
11 鉄道会社毎のカラーコード | カラーコード(色) 5
12 RGBの種類 ／ ビットカラー | RGB(色) 4
13 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 3
13 画像縦横比の問題 | 画像 3
13 「パッケージ化されてない拡張機能を読み込む」でインストールした拡張は、chromeを「更新」すると正常動作しなくなることがあります。 | Chrome 拡張機能 3
13 「bgcolor」「background-color」「background」の違い | CSS 3
2026/4/18 5:05 更新
指定期間人気ページランキング ／ 2020-5-30 → 2026-4-17
順位 ページタイトル抜粋 アクセス数
1 RGB ⇔ Lab | 色変換(色) 8933
2 「マウスオーバー」「ロールオーバー」「ホバー」の違い | CSS 4623
3 Design 0 4106
4 血の色 ／ #b30000 ／ #360800 ／ #ff0000 | カラーコード(色) 3798
5 Windows10で「Google Chrome」が常に最前面に表示される。「アクティブウィンドウ」が最前面で表示されない → 解決方法存在しない | Google Chrome(ブラウザ) 2787
6 RGBの種類 ／ ビットカラー | RGB(色) 2778
7 「bgcolor」「background-color」「background」の違い | CSS 2104
8 Chromeデベロッパーツールで、スマホソースコードを確認したいが、USBデバッグ機能をどうしても有効にすることが出来ない | モバイルデザイン(デザイン) 2101
9 金融機関ブランドカラー ／ コーポレートカラー | カラーコード(色) 1984
10 16進数カラーコード ／ 2進数 1889
11 「コズミックブルー」は、くすんだ青系全般の色を指す用語だと思います。 | カラーコード(色) 1886
12 「:hover」「z-index」を組み合わせて使用すると、正常動作しないことがある | z-index(CSS) 1720
13 「Font Awesome 4」と「Font Awesome 5」の違い(Font Awesome バージョン4からのアップグレード) | Font Awesome(フォント) 1703
14 「属性」「プロパティ」「アトリビュート」の違い | CSS 1647
15 「パッケージ化されてない拡張機能を読み込む」でインストールした拡張は、chromeを「更新」すると正常動作しなくなることがあります。 | Chrome 拡張機能(ブラウザ) 1568
16 「Bootstrapデザイン」✕「グラフ」 | 2系(Bootstrap) 1537
17 「東京都」のカラーコード取得は難しい | カラーコード(色) 1443
18 Chrome でキャッシュを効かさない | Google Chrome(ブラウザ) 1394
19 「Chrome拡張機能」開発中に遭遇したエラー | Chrome 拡張機能 1250
20 「西武鉄道株式会社」のブランドカラーは、3色(#3366CC、#66CCFF、#33CC66) | 色 1235
2026/4/18 5:05 更新