How to create a responsive table using HTML and CSS.

Подписаться 1,1 тыс.

Просмотров 50 тыс.

50% 1

In this video, you are going to learn how to create a responsive table using HTML and CSS.
Check out this video
▶ Responsive Side Navigation Bar in HTML CSS And JavaScript | Dashboard Sidebar Menu
• Responsive Side Naviga...
▶ How to create a Responsive Admin Dashboard Using HTML CSS.
• How to create a Respon...
▶ How to create a Responsive Image Gallery Dashboard using HTML and CSS
• How to create a Respon...
▶ Responsive side menu design using HTML and CSS.
• Responsive side menu d...
▶ How to create a responsive table using HTML and CSS.
• How to create a respon...
▶ How to create a draggable side menu using HTML and CSS.
• How to create a dragga...
................................................................................
I hope you will like this Dashboard Sidebar Menu Design. Feel free to get the source code of this Sidebar Menu from the given link.
www.codewora.com/design/table/
Don't forget to leave feedback in the comment section
................................................................................
If you like my video don't forget to hit a like and subscribe button.
⏱ Timestamps
00:00 Design Intro
00:36 Design Setup
01:34 Table Header
03:28 Table Content
10:15 Table Pagination
12:17 Final intro
12:54 End screen
► Music Credit:-
Artist: Aakash Gandhi
Title: Liquid Time
Download Song: bit.ly/38VXGlx
Song: Erik Lund - Summertime (Vlog No Copyright Music)
Music promoted by Vlog No Copyright Music.
Video Link: • Video
Song: LiQWYD - Birthday
Music provided by Vlog No Copyright Music.
Creative Commons - Attribution 3.0 Unported
Video Link: • LiQWYD - Birthday (Vlo...
Song: Xad - Birds (Vlog No Copyright Music)
Music provided by Vlog No Copyright Music.
Video Link: • Xad - Birds (Vlog No C...
....................................................................
#table
#responsivetable
#HTMLCSS
#HTML
#CSS

Опубликовано:

15 май 2024

Ссылка:

Скачать:

Готовим ссылку...

Добавить в:

Мой плейлист

Посмотреть позже

Комментарии : 31

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

Nicely done!!

@Hariss1311 Год назад

🔥🔥🔥🔥

@phonevelarde Год назад

Excelente sir.. thanks for shared this info.

@FutureWeb Год назад

Thanks 🙏

@imanmehtari9506 Год назад

Excellent Excellent Excellent Excellent

@FutureWeb Год назад

Thanks bro

@eknowledge2278 Год назад

Good work ♥️

@FutureWeb Год назад

Thanks bro

@gabrielramosrochadel9220 2 года назад

Good

@FutureWeb 2 года назад

Thanks😊

@RanalaManaja Год назад

Hey . I'm very interested in your design it is awesome . Would you mind if I have a chat with you .

@FutureWeb Год назад

Sure drop me mail Codingzone2@gmail.com

@RanalaManaja Год назад

@@FutureWeb Thank-you very much

@touhidrahman9775 Год назад

I cant find the download option through the link!

@FutureWeb Год назад

Sorry due to maintenance. I lost the code for this table design. I tried to find out the code but was not able to find sorry for the inconvenience.

@phamhoangtrungk15hcm30 Год назад

I don't see source code in descripton. Please give me the link

@FutureWeb Год назад

www.codewora.com/design/table/

@sarahterkmani1894 Месяц назад

birru

@roxrox2399 2 года назад

please give me the code

@FutureWeb 2 года назад

Please check the description you will find the link for the code

@web_hub Год назад

source code please

@FutureWeb Год назад

Please check the description section. www.codewora.com/design/table/

@afrodu7212 Год назад

@@FutureWeb ce lien ne donne pas le code source

@knuseski Год назад

This is not a responsive table, you are just adding a horizontal scroll...

@FutureWeb Год назад

Do you have any idea how to make the table row responsive according to the screen size. If yes please leave a comment. I will try to make table behavior that you want. Thanks for your valuable Feedback

@simboy Год назад

@@FutureWeb well you can make certain columns hidden when the screen changes or double up rows. i've been hearing that a a scroll bar is unresponsive becoz on a smart phone you cant really scroll thats what ive been picking up in css vids, in other words in such cases @media used to prevent scrolling on the smaller screen sizes?? am i mixed up?

@FutureWeb Год назад

Double the row may confuse the user. But we can hide the columns based on screen size. Thanks @simboy for the valueable feedback

@simboy Год назад

@@FutureWeb im working on a complicated table that fetches data and opens an expanded table for each row, im using react-table but the api is confusing so alot of the funtionality i was coding by hand. >> thats just why i was thinking about these problems, not that im good at css at all. what comes to me is that if you have hidden colums youd probably need a menu component for just small screens, to allow the user to choose which columns to show. i have no idea how scrolling works on touch screens and reponsiveness kind of glosses over these features keeping them more for native apps than a catch-all html/css site serving different screens. im kind of in the dark as to how devs go about coding for smart devices and pcs at that level. as far as i know they dont, and if someone wants all that added functionality you need to make a native app. not sure if css can handle that stuff. id like to think it can. coz it would mean one code base.

@FutureWeb Год назад

@simboy we can add a menu that is used to hide and show the column in the table. But it required lots of coding effort but it is possible with css and javascript. But in react handling this kind of things are very easy. Thanks for the suggestion I will work on that.