ACSS 101.16 - Content Grid (Basics)

Поделиться
HTML-код
  • Опубликовано: 28 ноя 2024

Комментарии • 31

  • @jeremiahhundley6629
    @jeremiahhundley6629 Месяц назад

    Just binged your videos for the last 2 weeks, all of Page Builder 101, and now about to finish ACSS 101. There is SOOOO much info. I began this journey (a serious newbie) that needed to create a handful of sites. Now that I am almost through. I'm interested to see how I will put it all together in my various projects.
    I chose ACSS because of all the incredible tutorials you created over the last two years. This is by far, the most tutorial based work flow I have found. And I really needed it.
    I still have a few videos to go. But I just wanted to say, thank you.

  • @twanpeeters8446
    @twanpeeters8446 Месяц назад +1

    Kevin, thanks for making all of these, and the entire ACSS, Frames and Etch team supporting you. ❤ It's thanks to your videos that I went in couple of months from a Gutenberg page builder designer to fully being able to style CSS, understand and inspect html and find my way around designing anything in Figma and then having the confidence to translate it to top-class websites. I just watched the entire ACSS 101 playlist on double speed - my head is melting but I'm so excited to play around and apply all of these tricks on my upcoming site! You are a great teacher.

  • @grasshopperweb
    @grasshopperweb Месяц назад +1

    Very curious about the follow-up. I've really enjoyed using content-grid ever since you showed it in action a little while back.

  • @Neoxphuse
    @Neoxphuse Месяц назад

    Another great tutorial. Making life a little more efficient. Thanks for the simple explanations.

  • @rafidiul-albani4590
    @rafidiul-albani4590 Месяц назад

    Great work.

  • @ALIMAHMA
    @ALIMAHMA Месяц назад

    Another great tutorial, Thanks for sharing

  • @AthloneH
    @AthloneH Месяц назад

    So useful even when writing blog posts to get e.g. embeds like YT videos or images to be highlighted.

  • @DavidWhiteGives
    @DavidWhiteGives Месяц назад

    Loving me some content grid. Hoping the zones don’t lead to fines lol. I thought this might be a joke. Now I am thinking of a specific issue that only I know I have that this will fix, so yeah, wow. Thanks Kevin very useful.

  • @thorsten-roever
    @thorsten-roever Месяц назад

    Thanks

  • @topp342
    @topp342 Месяц назад

    Very handy.

  • @rolandoveca
    @rolandoveca Месяц назад

    This is exactly what I need, I still have doubts about whether or not to buy ACSS because there is almost no content on how to use or configure it and I am afraid of the learning curve and that in the long run it will slow down my website development process, please make more tutorials so I can make a better decision.

    • @AutomaticCSS
      @AutomaticCSS  Месяц назад +5

      There are hundreds of hours of videos available including an official 101 course. I’m confused when you say there aren’t enough tutorials.

    • @rolandoveca
      @rolandoveca Месяц назад

      @@AutomaticCSS Hello, greetings, where are the courses? Can you give me the link please?

    • @JacobBall75
      @JacobBall75 Месяц назад +2

      @@rolandovecaIf you look at the videos for this channel, you’ll see a bunch that relate to the current ACSS version, along with stacks of others. If you search for Kevin Geary’s name, you’ll find his other channel that has a series called PB101 (Page Building 101) that you’ll find tremendously helpful in a general sense but also how ACSS fits in. It’s also got dozens of other videos that can help. Not only that, the docs on the ACSS website will help a lot too.
      Don’t stress too much about the learning curve, as you can build on your knowledge of how to use it as you get more confident with it and discover more ways it can help. Start off slow, set your colour palette, build some sections, use some utility classes, it will all start coming together.
      In the long run, it will save you HOURS of development time. Trust me on this 👍

    • @nasmith67
      @nasmith67 Месяц назад +1

      If you look at recommended videos under/beside this video, you will see plenty of ACSS 101.xx related content. Also you can go to the link on the bottom of the ACSS website. It is also shown when Kevin is visiting the website in this video.

    • @sean-gs
      @sean-gs Месяц назад +2

      I think Kevin is the one making the most courses in the Bricks community, so if this concern you don't be. I don't think there is anyone else in this community making as many useful videos as him.

  • @Simon-sly
    @Simon-sly Месяц назад +1

    Daymn! That is stupidly good. So good that I think I would like content-grid to be applied to sections by default! Is that possible?

    • @Gearyco
      @Gearyco Месяц назад +3

      Yes, there's an option for it in the content grid dashboard. If you're a Frames user, some frames will need some adjustment when using content grid by default, so just a heads up.

  • @SteveLaw78
    @SteveLaw78 Месяц назад +1

    When you first introduced the content grid a while back, you mentioned that once ACSS 3.0 came out, we could add content grid to custom classes. Is that possible now, or do we still require the utility class on the parent?

    • @AutomaticCSS
      @AutomaticCSS  Месяц назад +2

      Still requires utility class right now. Or you can make it the default for sections. I’ll look into making a recipe for it

  • @krissborowy3627
    @krissborowy3627 Месяц назад

    Thanks for another tutorial material.
    I have regarding the use of Content Grid one question.
    Is it possible to apply it in Gutenberg and Bricks at the same time.
    I am generally designing the site in Bricks, but the posts will be written in the Gutenberg editor. I would like the content to have, for example, 800px while the added images inside the text have 1000-1200px.
    If I add a section in the Bricks template, which has a default width and padding set by ACSS. If I add a photo then its width will be the same as the width of the section.
    Adding the block “Post Content” in brick all the content also has the width of this section in the created Bricks template.
    I hope you understand me? What I mean?
    I will be grateful for your help.
    THX Kriss

    • @AutomaticCSS
      @AutomaticCSS  Месяц назад

      It’s not possible since content grid requires a utility class and Gutenberg doesn’t have a main container element that you can access.

  • @quazimohammadfaisal8462
    @quazimohammadfaisal8462 Месяц назад

    'content-grid' is a godsend! However, one problem I see is that the flex-grow property does not work for the containers inside section. Any workaround for that?

    • @AutomaticCSS
      @AutomaticCSS  Месяц назад

      For what reason is that needed?

    • @quazimohammadfaisal8462
      @quazimohammadfaisal8462 Месяц назад

      See if this makes sense:
      section (fullscreen height with 100dvh. content-grid enabled)
      - container_1 (nav bar with feature-max width. 300px max height)
      - container_2 (flex-grow: 1 . Need the container to occupy the remaining viewport height)
      But once content-grid is enabled in section, flex-grow does not work anymore on container_2.

  • @reggiewaysama
    @reggiewaysama Месяц назад

    When will be the part 2?

    • @AutomaticCSS
      @AutomaticCSS  Месяц назад +2

      When it’s recorded and edited

    • @reggiewaysama
      @reggiewaysama Месяц назад

      @@AutomaticCSS Thanks, looking forward to use it on our upcoming website build.