画像を横幅だけ縮めたい

上の画像の棒の部分を立て幅は同じにして、ページの縮小とともに横幅だけ縮めたいです。
どうすればよいのでしょうか。

html
1            <img src="../images/o23.png" class="stick">

css
1.stick{
2      max-width: 100%;
3      height: 100%;
4      width: auto;
5    }

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

回答2件

ベストアンサー

display: block;
を追加してみるといかがでしょうか?

追記しました。こちらでいかがでしょうか?

CSS
1.stick {
2  max-width: 100%;
3  width: 100%;
4  height: 40px; /* 好きな高さを設定してください */
5  display: block; /* 不要かもしれません */
6}

投稿2020/05/12 04:30

総合スコア4528

退会済みユーザー

2020/05/12 04:34

ダメでした(泣)

2020/05/12 04:40

追記しました。上記でいかがでしょうか?

退会済みユーザー

2020/05/12 04:48

できました！ありがとうございます。

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

コードの確認していませんがこれでできませんかね

CSS
1.stick{
2      max-width: 100%;
3      max-height: 100%;
4      min-height: 100%;
5      width: auto;
6    }
7

投稿2020/05/12 04:30

総合スコア233

退会済みユーザー

2020/05/12 04:31

ダメでした(泣)

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

あなたの回答

tips

プレビュー

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

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

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

ただいまの回答率
85.35%

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

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

関連した質問