質問編集履歴
2
a
test
CHANGED
File without changes
|
test
CHANGED
@@ -408,6 +408,10 @@
|
|
408
408
|
|
409
409
|
|
410
410
|
|
411
|
+
justify-content:space-around も試しましたがうまくいきませんでした。
|
412
|
+
|
413
|
+
|
414
|
+
|
411
415
|
アドバイスいただけると助かります。
|
412
416
|
|
413
417
|
|
1
z
test
CHANGED
File without changes
|
test
CHANGED
@@ -393,3 +393,95 @@
|
|
393
393
|
Bootstrapを使っての5列配置やflexも今勉強しているのですが、なかなか思い通りになりません。
|
394
394
|
|
395
395
|
サポート頂けると幸いです。
|
396
|
+
|
397
|
+
|
398
|
+
|
399
|
+
|
400
|
+
|
401
|
+
【追記】
|
402
|
+
|
403
|
+
現状以下のようにできました。
|
404
|
+
|
405
|
+
ただ均等に配置できておりません。
|
406
|
+
|
407
|
+
またこれを2列にする方法も模索中です。
|
408
|
+
|
409
|
+
|
410
|
+
|
411
|
+
アドバイスいただけると助かります。
|
412
|
+
|
413
|
+
|
414
|
+
|
415
|
+
![イメージ説明](0aa9209bd8be2b80deac710d302df692.png)
|
416
|
+
|
417
|
+
|
418
|
+
|
419
|
+
```HTML
|
420
|
+
|
421
|
+
<div class="flex-container">
|
422
|
+
|
423
|
+
<div class="flex-item">
|
424
|
+
|
425
|
+
<img class="testimonials-img" src="img/blog/1.jpg" alt="">
|
426
|
+
|
427
|
+
</div>
|
428
|
+
|
429
|
+
<div class="flex-item">
|
430
|
+
|
431
|
+
<img class="testimonials-img" src="img/blog/1.jpg" alt="">
|
432
|
+
|
433
|
+
</div>
|
434
|
+
|
435
|
+
<div class="flex-item">
|
436
|
+
|
437
|
+
<img class="testimonials-img" src="img/blog/1.jpg" alt="">
|
438
|
+
|
439
|
+
</div>
|
440
|
+
|
441
|
+
<div class="flex-item">
|
442
|
+
|
443
|
+
<img class="testimonials-img" src="img/blog/1.jpg" alt="">
|
444
|
+
|
445
|
+
</div>
|
446
|
+
|
447
|
+
<div class="flex-item">
|
448
|
+
|
449
|
+
<img class="testimonials-img" src="img/blog/1.jpg" alt="">
|
450
|
+
|
451
|
+
</div>
|
452
|
+
|
453
|
+
</div>
|
454
|
+
|
455
|
+
```
|
456
|
+
|
457
|
+
|
458
|
+
|
459
|
+
```CSS
|
460
|
+
|
461
|
+
/* 親要素(コンテナ) */
|
462
|
+
|
463
|
+
.flex-container {
|
464
|
+
|
465
|
+
background-color: #dfdfdf;
|
466
|
+
|
467
|
+
display: flex;
|
468
|
+
|
469
|
+
}
|
470
|
+
|
471
|
+
/* 子要素(アイテム) */
|
472
|
+
|
473
|
+
.flex-item {
|
474
|
+
|
475
|
+
margin: 10px auto;
|
476
|
+
|
477
|
+
padding: 5px 10px;
|
478
|
+
|
479
|
+
box-sizing: border-box;
|
480
|
+
|
481
|
+
background-color: #343434;
|
482
|
+
|
483
|
+
color: #fff;
|
484
|
+
|
485
|
+
}
|
486
|
+
|
487
|
+
```
|