Common CSS properties and how they work
Ғылым және технология
It doesn't take that many properties to style your site really nice. These roughly 20 properties should be a good foundation to build anything you want.
Previous video on HTML tags: • Common HTML tags and w...
Hope you enjoyed the video!
Check out this code here:
github.com/engineer-man/youtu...
Join my Discord server to chat with me:
/ discord
Check out some code on my GitHub:
github.com/realtux
github.com/engineer-man/youtube
Come visit us on Reddit:
/ engineerman
Other Social:
/ _engineerman
/ engineermanyt
Пікірлер: 65
This is actually the most complete yet compact course in html css on the whole internet!
@kajautus
2 жыл бұрын
And it took like 10min.
Thank you so much. A lot of some youtubers who explained this, won't get to the point. Some even take hours trying to cover what you did here in 12 mins. For the hours and mins and secs that you have saved me, thank you sooo much.
i'm glad chase had an absolute and fixed position. cute dog. thanks man!
This is head and shoulders the best HTML/CSS video I've seen anywhere; it answered pretty much every question I've ever had so I'm extremely grateful to you
I love your short concise style of covering syntax, it's refreshing and so much more efficient than other KZread video's, I hope my comment helps the algorithm :p
Pumped for the next video recreating pages!
Bro Ive watched so many videos on the subject you're the only one who took the time to explain the basics... Awesome stuff man much apreciated !
@EngineerMan
2 жыл бұрын
You're welcome :)
Great way of putting things and explanation structure! Thank You!
Best CSS explanation! Thank you!
thanks for the video! exactly what I was looking for
Like a breath of fresh air. Fundamentals are important!
This really helped, thank you.
#whatsgoinonjineers
Thank you for sharing this.
subbed bcz this helped and finding you was difficult
great and simple to understand explanation. I missed "float" though.
@EngineerMan
3 жыл бұрын
I ended up cutting float out at the editing process because I wasn't satisfied how I explained it. I'll be sure to cover it in a future HTML/CSS video (there's still a couple more to go).
This is wonderful. Finally someone explains this nicely enough with the right visuals to make it click. I have struggled with CSS for so long and gave up because when I try to experiment with it, nothing changes on the webpage or it breaks something unrelated. CSS debugging tools are no help and I'm left to google stuff and watch videos in accents I can barely comprehend. Thank you for doing this and I can't wait to see you break down and recreate websites from scratch. Someone needs to make that a series of videos if that doesn't already exist.
Must be something in the air, I was right in the middle of making a new local site just to make listening to music and going through my files a bit more enjoyable.
I've recently been building my own site - for fun mostly. I've used Bootstrap to handle the styling, do you always write custom css for your projects or do you use pre-built libraries?
@EngineerMan
3 жыл бұрын
In 2020 for any non-trivial project I'll use a CSS framework. Typically Bootstrap, Foundation, or Material Components for Web.
thank you so much 👍
Great, Thanks a lot!
Thanks for explaining the difference between padding and margin. Those always confused me.
@Engineer Man Thank you for a great tutorial. Question: How come you prepend the main.css stylesheet with a forward slash when you link to it inside the index.html? I can reproduce the tutorial sample webpage when not prepending this file with a "/". I use the same folder structure as well.
@EngineerMan
2 жыл бұрын
On a URL that is just "/" it doesn't matter if you do "/main.css" or "main.css". However, if you were on a URL that was like "/users/login" and you put "main.css" it would try to request that from the URL "/users/login/main.css" which wouldn't exist. Generally speaking you want to express URLs as the full path including the "/" in the beginning.
I am struggling learn web Development 2 years i see recommendations in feed i glad youtube algorithm thanks enginner man
Why are you so underrated, man??
@noweare1
Жыл бұрын
It takes years to be an overnight sensation.
2137? He used the funny number! Pope JP2 loves you!
Thank you so much! Great overview! If I want a footer on my web page, what do you reccomend? If the page content is short then the footer will look out of place. Any reccomendations welcome
@danield.7359
3 жыл бұрын
The "fixed" position property ("position: fixed;") could help as it makes the item stay in the same position within a view-port regardless of the view-port's size and regardless if scrolling.
@futbolplayer913
3 жыл бұрын
@@danield.7359 A fixed footer behaves similar to the accept cookies notifications on sites. Do you recommend I have it as relative and switch to fixed if the height is too small?
@septim2315
3 жыл бұрын
Why not use absolute positioning? Put it at the end of the uppermost parent or before then position it absolute with bottom: 0
@danield.7359
3 жыл бұрын
@@futbolplayer913 try the solution of Septim if you like it to stay at the bottom of the document. Means, if you scroll up (say the document is longer than the view port) it will disappear. Otherwise with the fixed position it may indeed behave like the (bugging) EU cookie notification.
@futbolplayer913
3 жыл бұрын
@@septim2315 Perfect. Thank you
Can python make search bot program to look website to buy chipset available stuff?
This is great, but how does one center a div?
@buddy.abc123
3 жыл бұрын
I google it everytime, I still don't know. CSS is the hardest part of a dev's job
@o156GTA
3 жыл бұрын
Make a class for the div and use "margin: auto;" and give it a width below 100% or it won't do anything.
@septim2315
3 жыл бұрын
If you can use flexbox for parent, use that + justify-content and align-items. If not use the margin method
@o156GTA
3 жыл бұрын
@@septim2315 Flexbox is very useful but I feel it needs a video of it's own.
For Canadians, the title Engineer is regulated and reserved for licensed individuals. With that in mind and seeing a video about CSS, well... Is that Engineering?
@EngineerMan
3 жыл бұрын
Maybe engineering with a lowercase e.
How do you configure Atom to auto refresh your browser like that?
@EngineerMan
3 жыл бұрын
It's not Atom that does that, it's the npm package live-server.
Doesn't your Atom get high CPU usage problems? Mine spikes up to 100% for no good reason erratically. Thinking of ditching Atom.
@EngineerMan
3 жыл бұрын
The only time I have high CPU issues with Atom is when I'm working on very large files. However, I suspect this would be a problem with most graphical editors.
@usingvancedplzdontban1128
3 жыл бұрын
@@EngineerMan unfortunately it happens much more frequently in Atom than VS Code for me. Even a simple Hello World Python script in Atom sometimes volcanoes my CPU to a constant 100% CPU usage, fans ablaze and all; ultimately crashing my PC. Anyway, good to hear you're not facing that problem.
why when I open a new document and I click on enter it's not ganging to google ??
What is the IDE you are using?
@braydenhouston
3 жыл бұрын
He is using the Atom Text Editor atom.io/
@pja1991
3 жыл бұрын
@@braydenhouston Thank you.
Cool
Open the firmware of mi band 4 ? How much costo to you make it?