HomeОбразованиеRelated VideosMore From: RefactorU

Introduction to CSS: 13. Block, Inline, Inline-Block, Float, and Clear - RefactorU

305 ratings | 26594 views
Introduction to CSS: 1. Course Introduction 2. Getting Started 1: Terminology 3. Your First CSS 1: Units 4. Your First CSS 2: Getting Started 5. Your First CSS 3: Inline Styles 6. Your First CSS 4: Style Tag 7. Your First CSS 5: CSS File 8. Selectors 1: Basic Selectors 9. Selectors 2: ID and Class 10. Selectors 3: Combination Selector 11. Selectors 4: Pseudo Selector 12. Basic CSS 1: Starter Rules 13. Basic Layout 1: Block, Inline, Inline-Block, Float, and Clear 14. Advanced Layout 1: Absolute, Relative, and Fixed 15. Centering Techniques 1: Inline 16. Centering Techniques 2: Horizontal Margin 17. Centering Techniques 3: Vertical 18. Normalize and Clearfixes 1: Normalize 19. Normalize and Clearfixes 2: Clearfix 20. Normalize and Clearfixes 3: Block Formatting Context 21. Architecture 1: Specificity 22. Architecture 2: Reusability, Maintainability, Modularity, Scalability, Semantics http://www.refactoru.com
Html code for embedding videos on your blog
Text Comments (23)
Tiago Soares Bueno (16 days ago)
Very good video! The information is clear and precise
Shuto wada (2 months ago)
うーんあの程度の2カラムの崩れ修正手こずるとか致命的かもな・・ flexでもこっちでもセマンティック意識しないならどーでも良い気する
Ali Nawaz (4 months ago)
very good explanation
Sam Dave Pollard (5 months ago)
Nice one. Thank You.
shmack (7 months ago)
emmet is your friend
Ashwin Sinha (9 months ago)
seriously you cleared all my queries related to this,,, best teacher... thanks man... :)
AlexGW (1 year ago)
Personally, I would suggest new comers avoid using floats - they're old school and unnecessary from a basic approach when it comes to building layouts. They cause more headaches when you haven't yet grasped the behaviour, and are left yelling at a screen when elements are over lapping and doing weird things! Stick with display: inline-block! There can be some caveats with multiple elements in the same parent using this property but once you set the parent to font-size: 0 (my preferred method) - you'll feel much better!
AlexGW (1 year ago)
FanboySlayer (1 year ago)
this maybe true but it is essential to understand it nonetheless because u may need to look at other people's code who use floats
Ron B Palmer (1 year ago)
OMG. I've struggled with these for a long time. This clears up so much. Thanks.
Ilya Zinkevych (1 year ago)
I came to front end interview with react redux background waiting to show my epic knowledge. And 1st thing I got asked was difference between inline and inline-block. I figured it out yet I understood that I'm missing basics. Thanks for completely clearing this out.
shawtydat (1 year ago)
videos like these are great! i was very confused when i first started learning the float properties, dabbled with it, got more confused, watch more videos, got better, exercised with float more, then watched this video. practice + watching videos help embed these concepts. thanks for this!
Hamza Khan (1 year ago)
very informative video. thanx bro
Muy 012 (1 year ago)
PLEASE tell me what text editor you are using
AlexGW (1 year ago)
It will require some setup - you'd be best off trying Atom or Notepad++ (windows) etc and finding what works for you.
Aakarsh singh (1 year ago)
Sublime text editor
MD ALTAF HOSSAIN (1 year ago)
hi it is very understandable and i would like to have more courses on line so i can be able to make a online news portal layout, please- regards
The Stowaway (2 years ago)
Thanks for making this video, but I still find this really confusing.
Rose Power (2 years ago)
Thanks so much! Perhaps a color background for the divs would be visually helpful though.
primazzo1 (3 years ago)
Excellent explanation. You have been very helpful. Thank You!
Andsix (3 years ago)
Very helpful thanks i have been struggling on thr inline-block property
Practice Repeat (4 years ago)
good stuff ...

Would you like to comment?

Join YouTube for a free account, or sign in if you are already a member.