Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS gird and flexbox

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #170610
    amandaobringer
    Participant

    I am creating by first flexbox layout and am having trouble aligning some elements to the bottom. I have created a Code Pen here:

    http://cdpn.io/aycqw

    I want the price and details button to align to the bottom of each box. The only way I have been able to accomplish this so far is to make each box a flexbox as well, however, when I do this, the h2 boxes at the top don’t maintain the correct height ( an I understand that there are different numbers of lines of text, but that doesn’t seem to be what is going on here), and I can’t figure out how to align the Details button to the right. See this CodePen for this problem:

    http://cdpn.io/dDylJ

    Any ideas on how to get these things to play my way would be appreciated.

    Also, I’m finding tons of Flexbox tutorials out there, but very few forums and resources addressing more detailed, sophisticated problems. Any help finding these would be appreciated as well.

    #170620
    jurotek
    Participant

    On your productPriceAndLink use align-items:center

    #170621
    amandaobringer
    Participant

    I added this, but nothing changed. Should product be a flexbox container?

    #170623
    jurotek
    Participant

    If you talking about the second example then try adding display:inline-block to h3 and .productLink

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.