こんにちは。
制作部のSです。
いつも混んでるアメ横です。
最近GETした飲み友達が上野界隈に詳しすぎるので、たまーにアメ横に出没しています笑
さて2020年の新年を迎え、気持ちを新たに頑張るぞ！と息巻くと同時に、WEBサイトを作成していると新しい発見や気付きが多く、改めてとても楽しい仕事だなと日々感じています。
私はWEB業務未経験で入社したので、なおさら思うわけです。
HTML,CSS,JavaScript,php,,,WEBサイトを１つ作成するためには、これらの機能をフルに活用します。
これらの機能はとても優秀で、使いこなせば作れないサイトはないほど！
今回はそんな優秀な機能を誇る中から、個人的に思入れのあるCSSプロパティの話をしようと思います。
経験者の方にとってはかなり古い知識と感じると思いますが、初めて知ったときの感動は経験者の方も同じだったはずです。
検索すればたくさん出てくるので、ざっくりとですが説明します。
◆フレックスボックス「display: flex;」
これは私が制作部へ移ってすぐの頃に、当時の主任からこれ使えるよ！とすすめられたプロパティです。
初めてのWEB業務でテンテコマイだったあの頃に教わった事もそうだし、主任は私が制作部へ移ってすぐに仕事を辞めてしまったんですよね。
そんな思い出も重なって自分の中で強く印象に残っているんです。
さてこの「display: flex;」最初は訳わからん状態なのですが使ってみるとびっくり！
簡単に要素の並び替えが出来るので、あっという間に見た目が整うわけです。
こんな感じ（横並びにしている）
↓
CSSに記載するのはたったの２つ。
「display: flex;」と「justify-content: space-around;」
この２つで綺麗に並び替えが可能なんですね。
さらに表示する順番も変更できるので、サイトのレイアウト調整も可能です。
他にも並び替えができるプロパティはあるのでサイトの構成によって適材適所で使い分けるのがいいと思います。
使用してみて個人的に感じたflexの一番の特徴は、要素の大きさを調整出来る事かなと思います。
「flex-grow」
「flex-shrink」
「flex-basis」
上記のプロパティは子要素に対して使用するのですが、自在に伸ばしたり縮ませたりといった挙動を制御でき、なおかつ自動で領域に格納してくれるすごいやつです。
要素の大きさを調整できれば、隙間なく綺麗に表示が出来るという事にも繋がるので、初めて知った時はflexすげー！CSSすげー！と思いましたね笑
入社して1年が経ちふと始めの頃を考えた時に、一番最初に浮かんできました。
初めての経験という事もそうだけど、その時の感情や気持ちと一緒に強く印象に残っているCSSです。
話は変わってプライベートの話もしようかな。
昨年は知り合ったばかりの友達と意気投合し、共通の趣味であるキャンプをしにナイフと酒のみを手に山へ２泊のサバイバルを楽しんできたのですが、、今年も行ってくる！笑
大好きなアウトドアで大自然のエネルギーを充電しながら制作業務をたくさんこなして印象に残る楽しい1年を過ごします♪
◆追伸
現在、制作部ではWEBサイトのレスポンシブ化にとても力を入れています！
新規での作成の他に、PCとスマホサイトが分かれている既存店舗のレスポンシブ対応も行っています。
レスポンシブ？そんなの任せろ！と強気な方、そしてレスポンシブがわからなくてもとにかくやる気のある方！
仕事もプライベートも”印象に残る”そんな楽しい時間を過ごしたい方のご応募お待ちしております。
