質問編集履歴

1 該当箇所が分からないので、全体のコードを貼らせて頂きました。ご了承下さい。🙇

kazuki_user

kazuki_user score 107

2020/02/11 21:21  投稿

background-imageを divの中で左寄せしたいです。 (back-ground-positionは作動せず。。)
background-imageを 各々3つのdivの中で正しいサイズで左寄せしたいです。
●現在、divいっぱいに画像が拡大表示されてしまっている状態です。
●back-ground-positionは作動しませんでした。
background-positionを使えば、background-imageは左寄せになると思ったのですが、なりませんでした。
現在、imageがdivの枠いっぱいに広がってしまっている状態です。
枠内で、左に綺麗に寄せたいです。
どなたか宜しくお願い致します。🙇
```HTML
<div class="ppp">
 <div class="container">
   <div class="row">
     
       <div class="col-12 col-lg-4">
         <div class="set">
           <h5>初期設定</h5>
           <p>ホスティング入門ガイド</p>
         </div>
       </div>
 
       <div class="col-12 col-lg-4">
         <div class="safe">
           <h5>安全</h5>
           <p>ホストを守るAirbnbの仕組み</p>
         </div>
       </div>
 
       <div class="col-12 col-lg-4">
         <div class="money">
           <h5>マネープラン</h5>
           <p>Airbnbで収益を得るには</p>
         </div>
       </div>
   
   </div>
 </div>
</div>
```
```CSS
h5 {
 font-weight: bold;
 font-size: 16px;
}
.ppp p {
 font-size: 14px;
}
.set{
 border: solid rgb(116, 113, 113) 2px;
 border-radius: 3px;
 box-shadow:2px 2px 1px ;
 width: 100%;
 height: 100px;
 padding-top: 20px;
 padding-left: 10px;
 display: flex;
 background-image: url("../entrance.jpg");👈👈👈👈👈👈
 background-position: 0 0 ;👈👈👈👈
 background-image: url("../entrance.jpg");*/👈👈👈👈👈👈*/
 background-position: 0 0 ;    */👈👈👈👈*/
}
.set img {
 width: 100px;
 height: 100px;
}
```
  • HTML

    24014 questions

    HTMLとは、ウェブ上の文書を記述・作成するためのマークアップ言語のことです。文章の中に記述することで、文書の論理構造などを設定することができます。ハイパーリンクを設定できるハイパーテキストであり、画像・リスト・表などのデータファイルをリンクする情報に結びつけて情報を整理します。現在あるネットワーク上のほとんどのウェブページはHTMLで作成されています。

  • CSS

    17138 questions

    CSSはXMLやHTMLで表現した色・レイアウト・フォントなどの要素を指示する仕様の1つです。

思考するエンジニアのためのQ&Aサイト「teratail」について詳しく知る