Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Flexbox layout equal widths (paragraph text not wrapping)

Tags:

html

css

flexbox

The first image is way wider than the other two because of the space taken up by the <p></p> element.

How do I ensure that the p wraps at the width of the flex box?

I have a working bootply.

/* CSS used here will be applied after bootstrap.css */
body { background-color: rgba(20,10,10,.4); }
div.container { background-color: white; }

@media (min-width: 1380px) {
  div.container {
    width: 1400px; } }  
  
div.container section {
  display: flex;
  align-items: stretch;
  flex-wrap: wrap;
  justify-content: space-between; 
}

div.container section div img {
  	width:100%;
}

div.container section div p {
  	width: 100%;
}

div.container section div {
  	border: 1px solid black;
  	flex-grow:1;
}

div.container section div+div {
  	margin-left:4rem;
}

div.container section h1 {
    color: #8f825a;
    font-size: 2.7rem;
    text-transform: none; 
}
  
div.container section h2 {
    color: #8f825a;
    font-size: 1.8rem; 
}
  
<div class="container">
    <h3>H3</h3>
    <h2>H2</h2>
    <section>
        <div>
            <img src="data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAKAAD/4QMpaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjAtYzA2MCA2MS4xMzQ3NzcsIDIwMTAvMDIvMTItMTc6MzI6MDAgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgV2luZG93cyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFRDU4MUQyM0ZGQzkxMUU2OEU3Q0ExNzE2NDQzNDYzOCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFRDU4MUQyNEZGQzkxMUU2OEU3Q0ExNzE2NDQzNDYzOCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVENTgxRDIxRkZDOTExRTY4RTdDQTE3MTY0NDM0NjM4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVENTgxRDIyRkZDOTExRTY4RTdDQTE3MTY0NDM0NjM4Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+/+4ADkFkb2JlAGTAAAAAAf/bAIQAFBAQGRIZJxcXJzImHyYyLiYmJiYu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">
            <h1>Heading 1</h1>
            <h2>Heading 2</h2>
            <p>foo dsalkfjds lakfjdlsk fksdalj fldsfjad slkafjdslk fdsajflkds aflkdjsaflkdsjfdslkafjdlks fjlkdsj</p>
        </div>
        <div>
            <img src="data:image/jpeg;base64,/9j/4QAYRXhpZgAASUkqAAgAAAAAAAAAAAAAAP/sABFEdWNreQABAAQAAAAKAAD/4QMpaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLwA8P3hwYWNrZXQgYmVnaW49Iu+7vyIgaWQ9Ilc1TTBNcENlaGlIenJlU3pOVGN6a2M5ZCI/PiA8eDp4bXBtZXRhIHhtbG5zOng9ImFkb2JlOm5zOm1ldGEvIiB4OnhtcHRrPSJBZG9iZSBYTVAgQ29yZSA1LjAtYzA2MCA2MS4xMzQ3NzcsIDIwMTAvMDIvMTItMTc6MzI6MDAgICAgICAgICI+IDxyZGY6UkRGIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyI+IDxyZGY6RGVzY3JpcHRpb24gcmRmOmFib3V0PSIiIHhtbG5zOnhtcD0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wLyIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bXA6Q3JlYXRvclRvb2w9IkFkb2JlIFBob3Rvc2hvcCBDUzUgV2luZG93cyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFRDU4MUQyM0ZGQzkxMUU2OEU3Q0ExNzE2NDQzNDYzOCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFRDU4MUQyNEZGQzkxMUU2OEU3Q0ExNzE2NDQzNDYzOCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVENTgxRDIxRkZDOTExRTY4RTdDQTE3MTY0NDM0NjM4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVENTgxRDIyRkZDOTExRTY4RTdDQTE3MTY0NDM0NjM4Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+/+4ADkFkb2JlAGTAAAAAAf/bAIQAFBAQGRIZJxcXJzImHyYyLiYmJiYu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">
            <h1>Heading 1</h1>
            <h2>Heading 2</h2>
        </div>
        <div>
            <img src="">
            <h1>Heading 1</h1>
            <h2>Heading 2</h2>
        </div>
    </section>
</div>
like image 642
Jim Avatar asked Mar 09 '17 14:03

Jim


1 Answers

Instead of flex-grow: 1 use flex: 1:

div.container section div {
    flex: 1;
}

revised demo

By using flex-grow: 1 by itself, you're leaving the two other flexibility properties at their default values. Namely, flex-shrink: 1 and flex-basis: auto (content width, in row-direction).

By using the flex property you are defining all three properties: flex: 1 is equivalent to:

  • flex-grow: 1
  • flex-shrink: 1
  • flex-basis: 0 (initial main size 0, not auto)

This allows your flex items to be equal width, regardless of their initial main size.

Other answers here are telling you to add flex-basis: 0 to your code. That effectively does the same thing. The spec recommends you use the flex property, however:

7.2. Components of Flexibility

Authors are encouraged to control flexibility using the flex shorthand rather than with its longhand properties directly, as the shorthand correctly resets any unspecified components to accommodate common uses.

For a complete explanation of the difference between flex-basis: auto and flex-basis: 0, see this post: Make flex-grow expand items based on their original size

like image 58
Michael Benjamin Avatar answered Sep 22 '22 01:09

Michael Benjamin