How to Add Scrolling & Sticky Headers to HTML Tables with CSS

Поделиться
HTML-код
  • Опубликовано: 4 окт 2024
  • It only takes a bit of CSS to make your HTML tables scrollable with some sticky headers. This is useful if you have a lot of rows in your table but don't want to take up too much space on the webpage.
    For your reference, check this out:
    developer.mozi...
    🏫 My Udemy Courses - www.udemy.com/...
    🎨 Download my VS Code theme - marketplace.vi...
    💜 Join my Discord Server - / discord
    🐦 Find me on Twitter - / dcodeyt
    💸 Support me on Patreon - / dcode
    📰 Follow me on DEV Community - dev.to/dcodeyt
    📹 Join this channel to get access to perks - / @dcode-software
    If this video helped you out and you'd like to see more, make sure to leave a like and subscribe to dcode!
    #dcode #html #css

Комментарии • 11

  • @douglascounts4634
    @douglascounts4634 8 месяцев назад

    I don’t know why, but I always have to search for your content. It never appears in my feed. I always watch your content even though it may be days or a week before I search for it again. Your bite-sized content is great.

    • @dcode-software
      @dcode-software  6 месяцев назад

      Thank you 🙏🏻 let me know if you have any content suggestions

  • @tgoyer
    @tgoyer 17 дней назад

    nth-of-type isn't "n. t. h.", it's "nth" -- as in "...4th, 5th, 6th, nth..." That is why it's a function that you pass a value into (the value of "n").

  • @johngates7293
    @johngates7293 5 месяцев назад

    Good stuff concise and clear tutorial.

  • @wildfoster
    @wildfoster 8 месяцев назад

    Nice one, we need more video contents like this ❤❤

  • @cindymora3860
    @cindymora3860 4 месяца назад

    Thank you Working smooth

  • @GarhwalTV1
    @GarhwalTV1 5 месяцев назад

    There's an issue when using position: sticky; it seems you can't use z-index to display a modal window above it, or it affects drop-downs. Is there a way to achieve this without using position: sticky?

    • @ybocajm1958
      @ybocajm1958 15 дней назад

      I am still trying to get better with CSS, but I found that I had a div with style overflow and when I commented that out, the sticky position worked. I have used z-index before, but I'm not sure if position sticky is messing with that or if it could be something else. I thought I recall width of 100% having an adverse effect. Just brainstorming. I'm sure by now you've figured it out anyway.

  • @MerthanMerter
    @MerthanMerter 6 месяцев назад

    its not responsive tho.

  • @leetcoder987
    @leetcoder987 3 месяца назад +2

    too much talking just get to the point