### 前提・実現したいことこんにちはプログラミング学習を始めて一か月のものです。ページの模写をしているのですが思い道理にいかなくて困っています。　[模写しようとしているページ](https://shptomoya.github.io/shiro/) ### 発生している問題・エラーメッセージ ``` 発生している問題 florisutとFor yourselfとの間で余分な余白ができてしまっている。 ``` ### 該当のソースコード ```

Work

オーダーメイドでのブーケ・アレンジメントのデザインのほか、
ウェディングやイベントの装花なども行なっています。
一人一人にあったご提案をさせていただきます。

Gift

花束をお送りしたいお相手、伝えたいお気持ちに合わせた
プレゼント用花束のアレンジメントをさせていただきま。花言葉などの豆知識もお伝えします。

Wedding

ウエディングドレスに合わせたブーケや式場の雰囲気に合う装花をご提案。お打ち合わせの流れや回数、費用などにつきましてはお問い合わせください。

Decoration

お写真を彩るお花を一輪から販売。
一定期間のご契約で定期的にご自宅へ配送させていただくことも可能です。

For yourself

お部屋の雰囲気やライフスタイルをお聞きしてご自宅用の花束をご提案し、少しでも長く咲かせるコツもお教えします。花束に合った花瓶をご提案することも可能です。

Florist

Shiro専属のフローリストたちをご紹介。
得意の分野であなたのオーダーを最大限に叶えます。

Shiyu

お花茶屋大学フラワーアレンジメント科を卒業後、さまざまな白い花を探すために世界を一周し、Shiroの創業者となる。

Mao

花の魅力に惹かれ、空間デザインの世界からフローリストの道を歩む。主に結婚式やイベントで使用するお花のディレクション担当。

Omichan

フローリスト兼ガーデナーという特殊な経歴をもつ。豊富な知識と技術でお客様のオーダーを叶える。

``` ```css @charset "UTF-8"; *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; } body { margin: 0; font-family: sans-serif; font-size: 16px; color: #2b2b2b; } h1, h2, h3, p { margin: 0; padding: 0; } a { color: #2b2b2b; text-decoration: none; } section { text-align: center; } .common-inner{ padding: 80px 0; max-width: 960px; margin: 0 auto; } .work-list{ display: flex; flex-direction: column; flex-wrap: wrap; align-content: space-between; height: 1680px; max-width: 960px; } .work-block{ width: 420px; } .work-block:not(:last-child){ padding-bottom: 80px; } #photo { padding-top:120px ; } .work-block__wrapper{ padding-top:16px ; text-align: left; } .work-block__title{ font-size: 24px; line-height: 1.0; } .work-block__text{ padding-top: 5px; font-size: 16px; line-height: 1.75; } .florist{ background: linear-gradient(white 50%, #ededed 50%); width: 100%; } .florist-list{ display: flex; width: 100%; } ``` ### 試したこと問題一つ目で試したこといろいろなところのpaddinngやmarginをいじったが解決しなかった。問題二つ目で試したこと親要素にdisplay:flex;したが横並びにならなかった。一応子要素にもやってみたが解決しなかった。 ### 補足情報（FW/ツールのバージョンなど）なし

	@@ -1 +1 @@
1	- 余分な余白の改善~~と画像とテキストを横並びに~~したい
1	+ 余分な余白を改善したい

質問編集履歴