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

回答編集履歴

2

コメントを受けて追記

2021/04/05 01:05

投稿

thyda.eiqau
thyda.eiqau

スコア2982

answer CHANGED
@@ -15,4 +15,14 @@
15
15
  + background-clip: padding-box;
16
16
  padding: 20px;
17
17
  }
18
+ ```
19
+
20
+ # コメントを受けて追記
21
+ 要件がよくわかりませんが擬似要素の例をご自身でご提示されていますのでborderである必要はないと読み取りました。背景に指定してしまってはどうですか。
22
+ ```css
23
+ div{
24
+ border-radius: 10px;
25
+ background: linear-gradient(270deg, green 0%, green 20px, white 20px, white 100%);
26
+ padding: 20px;
27
+ }
18
28
  ```

1

コメントを受けて追記

2021/04/05 01:05

投稿

thyda.eiqau
thyda.eiqau

スコア2982

answer CHANGED
@@ -1,1 +1,18 @@
1
- 仕様かどうかは存じませんがborder: 1px solid transparent;を指定しておくと消えるように思います
1
+ 仕様かどうかは存じませんがborder: 1px solid transparent;を指定しておくと消えるように思います
2
+
3
+ # コメントを受けて追記
4
+ ```diff
5
+ body{
6
+ background: #f9f9f9;
7
+ padding: 50px;
8
+ }
9
+ div{
10
+ border-radius: 10px;
11
+ + border: 1px solid transparent;
12
+ border-right: 20px solid green;
13
+ - background: white;
14
+ + background-color: white;
15
+ + background-clip: padding-box;
16
+ padding: 20px;
17
+ }
18
+ ```