- This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
Viewing 4 posts - 1 through 4 (of 4 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
I am creating by first flexbox layout and am having trouble aligning some elements to the bottom. I have created a Code Pen here:
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:
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.
On your productPriceAndLink
use align-items:center
I added this, but nothing changed. Should product
be a flexbox container?
If you talking about the second example then try adding display:inline-block
to h3
and .productLink