ulタグで画像を囲んだ時の隙間を無くしたい

画像のように、ulタグで画像を囲んだ時にできる黄色い隙間をなくすにはどうすれば良いのでしょうか。

html
1<!DOCTYPE html>
2<html lang="ja">
3<head>
4	<title>サンプル</title>
5	<link rel="stylesheet" type="text/css" href="style8.css">
6</head>
7<body>
8
9<div class="boxA">
10<h1>WORKS</h1>
11<div class="boxA-1">
12<div class="boxA-1-1">
13	<ul>
14		<li><img src="img/pic1.jpg"></li>
15		<li><img src="img/pic1.jpg"></li>
16		
17	</ul>
18</div>
19<div class="boxA-1-1">
20	BBBB
21</div>
22<div class="boxA-1-1">
23	CCC
24</div>
25<div class="boxA-1-1">
26	DDD
27</div>
28</div>
29</div>
30
31</body>
32</html>
33
34
35body {
36	margin: 0;
37	margin-right: auto;
38	margin-left: auto;
39	width: 70%;
40
41
42}
43
44h1 {
45	margin: 0;
46	text-align: center;
47	color: #fff;
48	padding-top: 20px;
49	padding-bottom: 20px;
50}
51
52.boxA {
53	background: #59676A;
54}
55
56.boxA-1:after {
57	content: "";
58	clear: both;
59	display: block;
60}
61
62.boxA-1-1 {
63	float: left;
64	width: 25%;
65}
66
67.boxA-1 img {
68	object-fit: contain;
69	max-height: 100%;
70	width: 100%;
71}
72
73.boxA-1 ul {
74	list-style: none;
75	margin: 0;
76	padding: 0;
77}
78
79.boxA-1-1:nth-of-type(1){
80	background: yellow;
81}
82.boxA-1-1:nth-of-type(2){
83	background: green;
84}
85.boxA-1-1:nth-of-type(3){
86	background: skyblue;
87}
88.boxA-1-1:nth-of-type(4){
89	background: red;
90}

行動規範の内容に同意します

回答1件

ベストアンサー

CSS
1.boxA-1 img {
2    display: block; /* 足す */
3}

投稿2018/12/29 06:32

kei344

総合スコア69398

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！

ulタグで画像を囲んだ時の隙間を無くしたい

関連した質問