Removing div padding from flex-box grid

  1. MDB Home Page
  2. Support Main Page
  3. MDB jQuery
Topic: Removing div padding from flex-box grid

St Clair Clarke pro asked 7 years ago

Hi, Given the following: <div class="d-flex flex-row"> <div class="p-2">Flex item 1</div> <div class="p-2">Flex item 2</div> <div class="p-2">Flex item 3</div> </div> How can I remove the default padding from the div elements? The padding takes up a significant amount of space with a few nested divs so I would like to remove them. Cheers

St Clair Clarke pro answered 7 years ago

Given the following: <div> </div> Is there some directive/component in mdb-angular that allows me to add scrollbars?

Edyta Dabrowska answered 7 years ago

.p-2 class is adding the padding, so you need to remove it. Regarding a scroll-bar, right now you can base on this. We will think about adding scrollbar component in the future.

St Clair Clarke pro answered 7 years ago

>>.p-2 class is adding the padding, so you need to remove it. What should I remove? .p-2? If that is the case how will I get to use the row and column grid? Is there a way to remove the padding from the p-2 class?

Edyta Dabrowska answered 7 years ago

Yes, you need to remove class .p-2 if you don't want the padding. The only thing it does is to add padding. .d-flex class creates a flexbox container and transform direct children elements into flex items. .flex-row class sets children items horizontally like in a row. .flex-column class sets children items vertically like in a column. More rules can be found here.
Write
Create snippet
Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Status

Answered

Specification of the issue
  • User: Pro
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: No
About author
St Clair Clarke
Pro User
12Support score
6Questions 4Answers
0Snippets likes 0Snippets