2017/12/20 インターン

今回も、次週とのことだったのですが、前回とは異なり、今回は課題が出ました。

新しいテキストエディタを作るところから、課題として出されたものを作るとのことでした。

実際に作り始め、新しいテキストエディタを作って、CSSで箱を作るまでは１０分もかからないぐらいで出来たのですが（訳あって急いでたのもある）、そこからまず、箱を好きなところに配置するとこで苦戦しました。

以前やったことあると思っていたのですが、箱を箱の横に持ってくることをやっていなかったようで、まず「回り込み」ってなんだ？ってとこからでした。

調べてみると、回り込みは横に回り込んでくるってことだそうで、

これを解除すると、下の段に代わるそうです。

float 回り込み

clear 回り込み解除

この中の値は、right, left, bothがあります。

これを使いながら、うまくレイアウトを決めていきます。

この時点で結構いい感じのが出来上がりました。

その後、画面をスクロールしても、ヘッダーが上に引っ付いて、常に見える状態にするために、ヘッダーを固定しようとしたのですがこれまた苦戦してしまい...

先にできていた友達に聞きながらしました。

position を使い、値をfixedにすることで固定できました。

これで固定はできたのですが、このヘッダーが周りに引っ付いてしまったことで、ほかの箱が繰り上がる形になり、ヘッダーとその直下にあった箱がかぶってしまいました。

なので下の箱のmarginの上部を広げてうまいことレイアウトできました。

最後に、右下に矢印ボタン作ってそれ押したらそのページのトップに戻る仕様を作りたかったのですが、ちょっと高度すぎて時間内にはできませんでした。

来週は冬休みなので冬休みのどこかの時間でやります。