teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

具体的に記載しなおしました。

2018/03/02 07:26

投稿

oek
oek

スコア8

title CHANGED
File without changes
body CHANGED
@@ -2,6 +2,10 @@
2
2
  リセットcssを読み込んだりしたのですが、適応されず困っています。
3
3
  お分かりになる方、ご助力をお願いいたします…!
4
4
 
5
+
6
+ 下記html、cssをプレビュー(GoogleChrome)で確認したところ、
7
+ <blockquote>にmarginが設定されていました。
8
+
5
9
  ----------私のコード----------
6
10
  ```html
7
11
  <blockquote>
@@ -23,6 +27,29 @@
23
27
  }
24
28
  ```
25
29
 
30
+ 私の方で設定した覚えがないので、Chromeの検証機能で確認すると、
31
+ user agent stylesheetというcssに記述されているmarginのようで、
32
+ そのcssはブラウザごとに設定されているデフォルトのcssという事が分かりました。
33
+ ※以下のコードです
34
+ ---------user agent styleshee-----------
35
+ ```css
36
+ blockquote {
37
+ display: block;
38
+ -webkit-margin-before: 1em;
39
+ -webkit-margin-after: 1em;
40
+ -webkit-margin-start: 40px;
41
+ -webkit-margin-end: 40px;
42
+ }
43
+ ```
44
+ 上記の、
45
+ -webkit-margin-start: 40px;
46
+ -webkit-margin-end: 40px;
47
+ の部分を無効化したいです。
48
+
49
+
50
+ そこで、リセットcssを設定し、user agent stylesheetを無効化しようとしましたが、
51
+ 反映されませんでした。
52
+
26
53
  ----------リセットcss----------
27
54
  ```css
28
55
  blockquote, q {
@@ -37,13 +64,6 @@
37
64
  }
38
65
  ```
39
66
 
67
+ そこで、加えてcssの<brockquote>にmargin:0;の記述をしましたが、やはりuser agent stylesheetの無効化はできませんでした。
68
+
40
- ---------user agent styleshee-----------
69
+ user agent stylesheetはどのようにして無効化できるのでしょうか。
41
- ```css
42
- blockquote {
43
- display: block;
44
- -webkit-margin-before: 1em;
45
- -webkit-margin-after: 1em;
46
- -webkit-margin-start: 40px;
47
- -webkit-margin-end: 40px;
48
- }
49
- ```