Last Updated : 23 Jul, 2025
Improve
Suggest changes
Like Article
Like
Report
We use "display flex" property in our CSS code to create a flexible layout. To remove display flex in CSS, We can simply set the display property of the particular element to another value like we can set "flex" to "block" or "inline-block" for our needs.
These are the following approaches to remove display flex in CSS:
Table of Content
Using "display: block" propertyUsing "display: inline-block" propertyUsing "display: block" property
First, create a basic HTML structure then inside the <body> tag, add a div element with the class "container" or you can use any other class also.Inside the main div create some other divs for showing properly to remove the display flex property.To remove the display: flex in your code use display: block.Example: The example code below shows how to remove display flex in CSS using display: block.
HTML<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Display Block Example</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="element">Item 1</div> <div class="element">Item 2</div> <div class="element">Item 3</div> </div> </body> </html> CSS
Output:
Output1Using "display: inline-block" property
First, create a basic HTML structure then inside the <body> tag, add a div element with the class "container" or you can use any other class also.And inside the main div create some other divs for showing properly to remove display flex property.To remove the display:flex in your code use display: inline-block.Example: The example code below shows how to remove display flex in CSS using display: inline-block.
HTML<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Display Inline-Block Example</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="container"> <div class="element">Item 1</div> <div class="element">Item 2</div> <div class="element">Item 3</div> </div> </body> </html> CSS
Output:
Output2 
