Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

How come paragraphs don't work in FLEXBOX?


Aurmont
Go to solution Solved by RyanDejaegher,

Question

I have this very basic HTML code with some flex content inside a full-screen div. However when I preview it, none of the paragraphs create a new paragraph. Instead, they all appear on a single line. Did I do something wrong?

<!DOCTYPE html>
<html lang="en">
<head>
<title>Page Title</title>
<style>
.main {
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
}
</style>
</head>
<body>
	<div class="main">
		<p>first line</p>
		<p>second line</p>
		<p>third line</p>
	</div>
</body>
</html>

 

Link to post
  • Answers 2
  • Created
  • Last Reply

Top Posters For This Question

Popular Days

Top Posters For This Question

Popular Posts

Hey @Aurmont, flexbox by default places all elements in a single row and doesn't wrap to the next line. If you want your paragraphs to appear one after another change your code to this. <style&

2 answers to this question

Recommended Posts

  • 1

Hey @Aurmont, flexbox by default places all elements in a single row and doesn't wrap to the next line. If you want your paragraphs to appear one after another change your code to this.

<style>
.main {
	height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
}
</style>

 

Philadelphia, PA

👉 Squarespace Tutorials 

Chat/Message on FB Messenger for quickest responsehttps://m.me/dejaegherryan

 

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...