How to Create Twitter Homepage Using HTML and CSS

In this video I will show you how to create twitter homepage using HTML and CSS. You will learn on the real example how to make CSS and HTML reusable and scalable.

🛠 Need a video editor?

📌 Social

📚 References

🕒 TIMESTAMPS
0:00 Introduction
2:56 Creating layout
13:08 Rendering brand
19:30 Left sidebar
33:05 List of tweets
51:03 Trending block
52:24 Trends for you
01:04:56 Who to follow
1:22:24 Outro

This video is NOT sponsored. Some product links are affiliate links which means if you buy something I'll receive a small commission.

[lci]

this is awesome! i haven't touched html and css since 8th grade but i was able to follow along (for the most part) and i really appreciate you not speeding things up even if it's just copy, pasting, and renaming stuff to reuse. i was intimidated by BEM at first but this really does feel more organized. thank you so much for this!

[HotSteamingJustice]

Thank you so much. I've been trying to make a 3 column layout with fixed position side bars like this for ages now and couldn't work it out.

[ashmehr]

your video took my css knowledge to whole another level. thanks!

[teleworkcivil]

super awesome. It looks exactly like the real Twitter page.

[stickyamp]

Am curious about why did you choose "Monster" to reference yourself in youtube

[harshinilakshmi]

Thank you so much for this! The code is explained so well

[hopeakakpo]

please what coding pad software did you use

[mossaybo]

Thank you, I'm less scared from CSS now .

[ingilizcederslerim]

where do you save the svg code? You don't show the details in the video. I appreciate the work but, while you are creating folders you dont explain how you do it... you just write something on the screen and I cant even understand on which software you write the code...

[Spychu]

I have troubles downloading the svg files. There's usually a link in the inspect menu, so I could open in new tab and right click download it. This time I see you've copied/paste the source into vsc. For me nothing happens. I don't know how to obtain the svg file :(

[Hangoutapp]

Hi. Can you make an Twitter tweet comment box with reply in html css an Javascript

[jayasuryas]

sir for me leftsidebar icon is not showing

[engelnkosi]

I don't understand how to save the svgs

[lama]

Hello!! I liked your channel sir!! Can you send source code please!!

[Xamze]

Man you made this more confusing couldn’t you have made it with simple css?