Responsive Flexbox Layout | CC

  Рет қаралды 30,154

CoCheat

CoCheat

Күн бұрын

Пікірлер: 31
@charlestoneoyoo
@charlestoneoyoo 10 ай бұрын
This is a nice KZbin Channel. Keep up with the posts
@enriquegrageda
@enriquegrageda 11 ай бұрын
Thanks for you work 😊
@mr.z6325
@mr.z6325 10 ай бұрын
Hi, I would like to understand why when you typed "flex-flow: row rap" why did all the items disappear? and what made it pop up like that? (3:06)
@CoCheatCoding
@CoCheatCoding 10 ай бұрын
I added a width to the items
@lofilove2572
@lofilove2572 9 ай бұрын
nice
@ykw2117
@ykw2117 10 ай бұрын
Unfortunately, the last part of the code (starting from @media .... ) is being covered by the You-tube's commercial and hence cannot be seen.
@naoart9320
@naoart9320 10 ай бұрын
@media all and (mind-width: 600px){ .side{ flex: 1; } }
@Jj-rc4dr
@Jj-rc4dr 9 ай бұрын
thanks for the explanation. I'm new and this is really helpful . but can you explain what the following code is used for : .container>* { margin: 10px; padding: 10px; flex: 1 100%; } I'm still stuck on that
@CoCheatCoding
@CoCheatCoding 9 ай бұрын
.container is your class and >* selects all direct children. padding add 10px of padding inside the selected element. margin adds 10 px of margin around the selected element. and flex 1 100% is shorthand for setting the flex-grow and flex-basis properties. it means the element will grow to fill the available space
@Jj-rc4dr
@Jj-rc4dr 9 ай бұрын
@@CoCheatCoding thanks 👍🏼
@giusyvignes1382
@giusyvignes1382 10 ай бұрын
Hi, I have the same layout with the two left and right sidebars, by default when the layout reduces the sidebars it always starts from the one on the left and then follows the one on the right, I would like to be able to reverse this order because I positioned the menu on the right and I would like to display the right sidebar first when the layout is resized, is it possible to do something like this? Can you reverse first right and then left? I thank you.
@CoCheatCoding
@CoCheatCoding 10 ай бұрын
Maby try row-reversed instead of row
@giusyvignes1382
@giusyvignes1382 10 ай бұрын
thank you, in this way I only managed to obtain the exchange of the two sidebars leaving the central one intact, I would like the sidebars to remain intact and to reverse only when resizing, left to right and right to left in order to obtain display main, side2, side1...
@giusyvignes1382
@giusyvignes1382 10 ай бұрын
hi, I tried but I think I will have to change a lot to the css, it is the first responsive layout, before this I only created simple layouts, to understand how it works I tried with another layout with a different media query, solved with flex-direction: column -reverse;, the left and right sidebars reverse perfectly. I thank you.
@andreasklug6569
@andreasklug6569 9 ай бұрын
You will have more freedom to order the elements if you use display grid instead of flexbox. With a grid, you can give the different fields manes and then order them as you want. See example: kzbin.info/www/bejne/bGmyZ5iFfKZ6p6M
@Ek-xtreme
@Ek-xtreme 10 ай бұрын
I'd rather use Grid way more adjustable then flex box my general rule of thumb is Flexbox for one dimensional layouts, Grid for multidimensional layouts ez stuff
@raffmusicgaming3687
@raffmusicgaming3687 10 ай бұрын
I'm an extreme beginner, could someone exactly explain me what's the purpose of this? And what's the sauce code that mad the 'Difference' thank you.
@ridelove13
@ridelove13 10 ай бұрын
if you look at a page on a pc it looks different than on an phone. With that you can access the page on a pc and phone and you can still read the page normally
@giusyvignes1382
@giusyvignes1382 10 ай бұрын
Hi, in the index.html page I can't read the entire etc, even in style.css I can't even see the last line @media all and (... Here I can read 600px){ .side{ flex: this ending doesn't I can see... The Number Is 1?} }.... it's the first time I've tried to make a responsive one, I created the template but side1 and side2 both remain on the left. Please, I would be grateful if you wrote the final code in a comment. Thank you. Ok, the Flex Number I believe Is 1, and the meta tag Is this? It's the First Time I try responsive template... unfortunately the video couldn't be seen well... ok, solved! it was .main{ order: 2;}... I misread it and entered 3. thanks. it's great!
@HeadGenCSGO
@HeadGenCSGO 10 ай бұрын
i like how you hide the part of code i was looking for at the end 😕
@lofi3044
@lofi3044 10 ай бұрын
thank you
@xanderlofi4466
@xanderlofi4466 Жыл бұрын
🙏🙏🙏🙏
@Nedjmeddine
@Nedjmeddine Жыл бұрын
Nice video
@arslanliaqat1720
@arslanliaqat1720 10 ай бұрын
no audio explanation......?
@ShortVideosOnYoutube
@ShortVideosOnYoutube 10 ай бұрын
Please max your font size ..this is too small
@kosamri
@kosamri Жыл бұрын
Nice one bro thanks 👍.
@androidrunner4890
@androidrunner4890 11 ай бұрын
❤❤
@ykw2117
@ykw2117 10 ай бұрын
😊
@chakabani123taftouf7
@chakabani123taftouf7 Жыл бұрын
please, remove music it disturbs too much.
@aviajay6
@aviajay6 Жыл бұрын
mute your damn audio 🤣
@viaxxl
@viaxxl 10 ай бұрын
Lover your volume to zero 🪄
Text and Img Side by Side | CC
2:04
CoCheat
Рет қаралды 169
Responsive Flexbox Layout | CSS ONLY
4:26
CoCheat
Рет қаралды 1 М.
Chain Game Strong ⛓️
00:21
Anwar Jibawi
Рет қаралды 41 МЛН
When you have a very capricious child 😂😘👍
00:16
Like Asiya
Рет қаралды 18 МЛН
How Strong Is Tape?
00:24
Stokes Twins
Рет қаралды 96 МЛН
CSS Tips And Tricks I Wish I Knew Before
12:12
Lama Dev
Рет қаралды 495 М.
Learn Flexbox CSS in 8 minutes
8:16
Slaying The Dragon
Рет қаралды 1,7 МЛН
Responsive CSS Grid Tutorial
17:14
Angela Design
Рет қаралды 850 М.
Flexbox NavBar | CCS Only
4:29
CoCheat
Рет қаралды 370
Create a clean, modern navigation with HTML & CSS
25:17
Kevin Powell
Рет қаралды 157 М.
Subtle, yet Beautiful Scroll Animations
5:04
Beyond Fireship
Рет қаралды 1,8 МЛН
How to Properly Layout A Website (For Beginners)
14:50
The Website Architect
Рет қаралды 671 М.
Responsive layout practice for beginners
1:11:37
Kevin Powell
Рет қаралды 110 М.
I Can Teach You CSS Position In 7 MINUTES!
7:31
Kyland Codes
Рет қаралды 16 М.
Chain Game Strong ⛓️
00:21
Anwar Jibawi
Рет қаралды 41 МЛН