表作成の難しさ

date_range 2024/09/05
日々の活動日記エンジニアインターン
松木 智哉
表


こんにちは!

京都開発研究所、Webプログラマコースの長期インターン生、松木智哉です!!


9月に初めて出勤しました!

今月のテーマは『進め!』です。自分自身が何をすべきか、パーツ班として、さらには京都開発研究所の長期インターン生としてなど、さまざまな視点で目標を設定し、行動計画を立てる必要があります。現状ではまだそれを言語化できていないため、早急に具体化していきたいと考えています!


今日は、パーツの作成に集中し、特に表の作成に時間をかけました!

HTMLとCSSのtableタグを使って表を作成したのですが、最初はシンプルな構造の表に見えたものの、実際に設計を進める中で「自由にデザインすることの難しさ」を痛感しました!

例えば、列の幅を調整したり、ヘッダーとボディのデザインを統一する際に、微妙なズレが生じることがあり、思った通りのレイアウトに仕上げるには細かな調整が必要でした!特に、レスポンシブ対応やスタイルの整合性を保つのが意外と難しく、CSSのtableの柔軟性を引き出すには工夫が必要だと感じました。


まだ修正が必要なので次に表の完成まで持っていきたいです!!

-----------------------------------------------

G!FIT公式Instagram:https://www.instagram.com/gfit_gdn/

G!FIT公式Twitter:https://twitter.com/gfit_gdn

メンバー紹介ページ:https://guardian.jpn.com/member/tomoya_matsuki/



*COMMENT*

  • 井坂 かなこ

    井坂 かなこ

    更新日:2024-09-05 18:01

    *コメント*

    お疲れ様です!
    テーマがあると意識的に取り組むことができるので
    ありがたいなといつも思っているところです!
    私もまだまだ勉強中ではありますが
    自分の思い通りにいかずにもどかしいこともありますよね💦
    一緒に頑張りましょう!!

    *コメント*

  • 木村 りえい

    木村 りえい

    更新日:2024-09-06 08:18

    *コメント*

    わかります。行と列を追加できるよう可変にしたいと思ったら、表の幅の指定どうするかとか、レスポンシブであればそのままスクロールするか、表の形を変形するかとか考える必要がありますよね。
    私も学び中ではありますが、tableの他にsubgridもあるので、ぜひこちらも試してみてください!

    *コメント*

  • 則岡 えり

    則岡 えり

    更新日:2024-09-06 09:28

    *コメント*

    お疲れ様です。
    table難しいですよね。私もしょっちゅう躓いています。
    お互いがんばりましょう!

    *コメント*

  • 池田 みはな

    池田 みはな

    更新日:2024-09-06 09:37

    *コメント*

    おつかれさまです。tableタグは微調整などが本当に大変ですよね!私もレスポンシブ対応で苦戦することが多いので、その気持ちすごくわかります。今はgridやdlタグなどを使って表を作成することも多いです。引き続き応援しています!

    *コメント*

  • 大橋 秀一郎

    大橋 秀一郎

    更新日:2024-09-06 14:34

    *コメント*

    レスポンシブ対応のためにレイアウト微調整に苦心されているとのこと、私も似たような状況なのでお気持ちよく分かります。
    体感ですが、実は微調整のために工数の多くを割いています。
    お互い頑張りましょう!

    *コメント*

  • 木下 さゆり

    木下 さゆり

    更新日:2024-09-06 16:41

    *コメント*

    お疲れ様です!
    表作成のコーディング、私もスクールに通っていた時にとてもとても苦戦しました・・・。
    こうやって記事にしてアドバイスのコメントをもらえたり、直接先輩に聞いたり出来る環境を最大限に活用していってくださいね!
    振り落とされないよう、進んで参りましょう^^

    *コメント*

  • 可信 なみ

    可信 なみ

    更新日:2024-09-09 12:11

    *コメント*

    シンプルに見えても、すぐ再現できずに難しさを感じたこと、私もあります。もっと成長していけるようお互い頑張りましょう!

    *コメント*

*コメント*

*ログイン*

メールアドレス
パスワード