【htmlで画像を中心に置く方法について教えてください】

実現したいこと

  • 左寄りの画像を中心に置きたいです。

前提

ECサイト構築中で画像付きのカテゴリーを表示させたのですが
左寄りになっており、html初心者のため、中心にする方法がわかりません。
詳しい方おりましたらご教示お願いいたします。

該当のソースコード

.nms-plugin-20230204044302 .block { display: block; } .nms-plugin-20230204044302 ul { list-style: none; margin: 0; padding: 0; display: -webkit-flex; display: flex; /*-webkit-justify-content: space-around; justify-content: space-around;*/ -webkit-align-items: stretch; align-items: stretch; flex-wrap: wrap; }

.nms-plugin-20230204044302 .item-list li {
margin: 0 5px;
width:9%;
text-align: center;
}
.nms-plugin-20230204044302 .item-list li a img {
width:100%;
}
.nms-plugin-20230204044302 .item-list li a {
color: #333;
text-decoration: none;
text-align: center;
}
.nms-plugin-20230204044302 .item-list li a:hover {
opacity: 0.7;
}
@media (min-width: 320px) and (max-width: 768px) {
.nms-plugin-20230204044302 ul {
overflow-x: scroll;
justify-content: left;
flex-wrap:nowrap;
}
.nms-plugin-20230204044302 .item-list li {
margin-bottom: 10px;
width:22%;
}

}
</style>

$name$

コメントを投稿

0 コメント