Flex Container Crash Course - Elementor Wordpress Tutorial

Поділитися
Вставка
  • Опубліковано 19 гру 2024

КОМЕНТАРІ • 60

  • @andreasleese
    @andreasleese 2 місяці тому +2

    This to date is THE most concise tutorial about FlexBox on UA-cam! So much information packed in a 20 Minute Video, you will want to watch it twice to get everything out of it.
    Great Job, as always! 👍👌

    • @websquadron
      @websquadron  2 місяці тому +1

      You may want to see the updated version :)
      ua-cam.com/video/rO7mFhFT4oo/v-deo.htmlfeature=shared

  • @Msdjebe
    @Msdjebe 7 місяців тому +4

    A very good quality tutorial! I'm quite advanced in Elementor and still discovered few things. Many thanks!

  • @LuisCamberosVids
    @LuisCamberosVids 7 місяців тому

    Just when I thought I knew everything about Flexbox, I picked up a lot of tips from your excellent tutorial!

  • @dannyalexander1876
    @dannyalexander1876 7 місяців тому +3

    You're awesome. Love your content and your dedication.
    Very knowledgeable, great at teaching, and enjoyable to watch and learn from/with.
    Thank you for hard work and commitment to helping others learn.
    It's appreciated, and so are you.
    All the best to you..

  • @dots560
    @dots560 7 місяців тому +1

    Thanks for this. I've been using multiple containers to achieve some of the things shown in this video.

  • @shahidulislam1612
    @shahidulislam1612 7 місяців тому +1

    WOW, this is a really great tutorial who want to learn Flexbox. Thanks, Imran brother

  • @LittleChicPrints
    @LittleChicPrints 6 місяців тому +1

    This was so helpful!! Thanks a lot for your guidance.

    • @websquadron
      @websquadron  6 місяців тому

      Got another coming up later this week

    • @LittleChicPrints
      @LittleChicPrints 6 місяців тому

      @@websquadron I actually just signed up for your course. I have a woocommerce store that I am having trouble designing. I am moving from shopify and a lot of features seem a bit hard to copy.

  • @kevinj4862
    @kevinj4862 7 місяців тому

    I prefer using grids. Helps me understand everything better.

  • @4Mulator
    @4Mulator 7 місяців тому +1

    Thank you, Imran! I thought I knew flex box containers, but I did learn something new from this tutorial! Would love something similar on grid thanks again!

  • @warblog6165
    @warblog6165 7 місяців тому +1

    I’ve been very reluctant to switch as I only build websites for me. After viewing this; and I will rerun later, I know I can switch without too much of a learning curve. As always: thank you for sharing your knowledge and advice.

    • @websquadron
      @websquadron  7 місяців тому

      Fantastic!

    • @websquadron
      @websquadron  7 місяців тому +1

      You can interchange and use both Sections and Containers on the same page if you're still getting used to it.

    • @warblog6165
      @warblog6165 7 місяців тому

      I presume this is adding a flex box to an existing page with sections ? My plan was to build and publish a large number of pages with sections containing no content that I could use if I was having problems adapting - whilst I practised - it get harder at 80 but great fun.

    • @websquadron
      @websquadron  7 місяців тому +1

      @@warblog6165 You can use Sections with no need to use Containers if that helps. The widgets that need Containers are the Loop Grid, Taxonomy Filters, the New Carousels, and the Nested Tabs/Accordions :)

    • @warblog6165
      @warblog6165 7 місяців тому

      I welcome the challenge; anyway I want to sample the contents of your Bento boxes 🤓 take care and thanks again

  • @webplics
    @webplics 7 місяців тому

    THanks Imran, hope Grid container next . well explained all the best.

  • @frog_marketing
    @frog_marketing 7 місяців тому

    Absolutely loving the grow function! I've been fiddling with the %s and worrying about how it will translate on the myriad of sizes - this is a game changer!

    • @websquadron
      @websquadron  7 місяців тому

      Once I realised what this does - it instantly saved me having more child containers

    • @frog_marketing
      @frog_marketing 7 місяців тому

      @@websquadron It's brilliant - honestly I wasn't a fan of containers to start with but for me Elementor has really upped their game with all this and all the other stuff they've been implementing!

  • @pezreloaded8436
    @pezreloaded8436 7 місяців тому +2

    The best helpful tutorials!

    • @linda_sue
      @linda_sue 7 місяців тому

      Makes me want to click and unclick the like button over and over!!!

  • @NicholasZein
    @NicholasZein 7 місяців тому +1

    Just brilliantly presented! 👏🙌 💪
    Thank you! 🙏

  • @QuaverloveStudio
    @QuaverloveStudio 7 місяців тому +1

    Great refresher!
    Thanks, Imran.

  • @webtappers7863
    @webtappers7863 7 місяців тому +1

    Great tutorial, thanks!

  • @CariOG
    @CariOG 7 місяців тому

    Nice Explanation! I've got one question though: is the align feature good in terms of speed optimization or is padding still more optimal? Thx in advance!

  • @umairyousafzai07
    @umairyousafzai07 7 місяців тому +1

    Great 👍

  • @MelTaylor
    @MelTaylor 7 місяців тому +1

    Thank you Imran.

  • @MrPhilcorn
    @MrPhilcorn 7 місяців тому

    Thanks that was helpful. Do you usually prefer Grids or Flexbox? Flexbox for more individual different styles and Grids more for like items which keep the same size, like image catalogs or similar?

    • @websquadron
      @websquadron  7 місяців тому

      Very much depends on the look. I work more with Flexbox than Grid. You're right that Grid is better for similar sized layouts.

  • @emv2280
    @emv2280 Місяць тому

    Doing a deep dive through your tutorials 😅, not sure if I missed this ,but when working with containers in columns, what is the best method to align each container to the same height? For example, one column container has less text than the other, and therefore is shorter, and how do I make this look good on mobile and tablet?

    • @websquadron
      @websquadron  Місяць тому +1

      You could apply stretch to the parent container

    • @emv2280
      @emv2280 Місяць тому

      @@websquadron Hey, thank you for your answer! Just realized I wasn't more specific, I am referring to the 'price tables' not being of equal length.

  • @taral927
    @taral927 7 місяців тому +1

    Yes, great presentation but you fried my brain at the same time after 10th minutes.🤣

    • @websquadron
      @websquadron  7 місяців тому

      Oh no! :) :) :)

    • @thepurpleufo
      @thepurpleufo 5 місяців тому

      Same here. :(

    • @websquadron
      @websquadron  5 місяців тому +1

      @@thepurpleufo Sorry to hear that :( An updated version is coming out soon :)

    • @thepurpleufo
      @thepurpleufo 5 місяців тому

      @@websquadron Hey...just to be clear...it's nothing against you or your tutorial...it's the whole thing of the flexbox that seems so hard to "get." You do great videos and I love your style.

    • @websquadron
      @websquadron  5 місяців тому +1

      @@thepurpleufo Don't worry. I've been prepping for simpler way to explain it anyway :) It's coming soon :)

  • @warblog6165
    @warblog6165 6 місяців тому

    Bit of a newbie question. I am still working in sections and want to use containers but want to be able to use sections as a fallback. Can I create a number of blank pages with simple sections then switch on containers and use containers if I want to alongside sections on these blank pages? I really want to have megamenus on section pages - is this possible? TIA

    • @websquadron
      @websquadron  6 місяців тому +1

      Yes. Of course. Just add a dummy page and stick sections on there. Then whenever you need to add a section to a page with containers - copy the section over. My tip is to add a section. Then add a section with an inner section inside. That way you’re covered.

  • @LuciousKage
    @LuciousKage 5 місяців тому

    Can anyone tell me how to make container be as thin as possible? it seems to have minimum height even without anything inside of around 40 px or so.
    How do we change that ?

    • @websquadron
      @websquadron  5 місяців тому +1

      Did you remove padding, and row/column gaps?
      You can also use select {height: 2px;}

    • @LuciousKage
      @LuciousKage 5 місяців тому

      @@websquadron i found out that it just looks like that in editor. but website showed correctly. thanks

  • @SharingTravelMoments
    @SharingTravelMoments 7 місяців тому

    careful how many times you say Far Right, you might get the UA-cam police after you lol

    • @websquadron
      @websquadron  7 місяців тому

      Just realised that! Yikes!