Hello. I personally have this issue too, on mdb-vue. Applying your solution gave me the following: https://imgur.com/9LxSIBh

The codebase for that section is as follows:

<template>
            <mdb-container fluid class="mx-0">
                <mdb-row class="mx-0 mb-3">
                    <mdb-col class="col-md-2">
                        <mdb-card class="lte mr-auto">
                            <mdb-card-body>
                                <mdb-card-text>Some</mdb-card-text>
                            </mdb-card-body>
                        </mdb-card>
                    </mdb-col>
                    <mdb-col class="col-md-2 offset-md-8">
                        <mdb-card class="lte ml-auto">
                            <mdb-card-body>
                                <mdb-card-text>Some</mdb-card-text>
                            </mdb-card-body>
                        </mdb-card>
                    </mdb-col>
                </mdb-row>
            </mdb-container>
    </template>

If there's something I'm doing wrong, please point it out.

Hi there, if you use MDBContainer component, you can add prop fluid to make a wrapping div full width. To remove left & right padding add custom CSS rules:

import React from 'react';
import { MDBBtn, MDBCard, MDBCardBody, MDBCardImage, MDBCardTitle, MDBCardText, MDBContainer } from 'mdbreact';
import './index.css'

const CardExample = () => {
  return (
    <MDBContainer fluid>
      <MDBCard >
        <MDBCardBody>
          <MDBCardTitle>Card title</MDBCardTitle>
          <MDBCardText>
            Some quick example text to build on the card title and make
            up the bulk of the card&apos;s content.
          </MDBCardText>
          <MDBBtn href="#">MDBBtn</MDBBtn>
        </MDBCardBody>
      </MDBCard>
    </MDBContainer>
  )
}

export default CardExample;

index.css

 .container-fluid{
      padding-left: 0;
      padding-right: 0;
    }