• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 102
  • Last Modified:

How to center-justify a multi-line text block that is centered in div using flex?

I'm new to flex. Here is what I'm trying to use so far?

.communityPromo{
  width:100%;
  max-width: none !important;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;    // center text block
  align-content:center;

This centers the text block in the div, but the text block remains left-justified.
}
0
dlearman1
Asked:
dlearman1
  • 3
  • 2
1 Solution
 
Julian HansenCommented:
Can you show us more of your code - the style is not enough to replicate the problem.
0
 
dlearman1Author Commented:
0
 
Julian HansenCommented:
Add text-align: center to the <p>
communityPromo  > p{
  max-width:50rem;
  text-align: center;
}

Open in new window

justify-content is about how to arrange space around the child elements.
0
 
dlearman1Author Commented:
Thanks Julian... that worked great
0
 
Julian HansenCommented:
You are welcome.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

  • 3
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now