我正在写一个宠物项目，需要移动的响应，我有一个问题，在旋转木马组件中白色，我不知道如何删除它，有人能帮助我吗？
这类似于PC https://imgur.com/a/3zwNDnl上的页面
这看起来像移动的设备https://imgur.com/a/qEwPDdC
我想去掉底部的空白区域，让旋转木马React灵敏，我该怎么做呢？
下面是我的组件代码

import ...

export default class CarouselBox extends Component{
    render(){
        return(
            
                <Carousel>
                    <Carousel.Item>
                        <img className="d-block w-100"
                        src={edinburghView1}
                        alt="Edinburgh_Uni"
                        />
                    <Carousel.Caption>
                        <Nav.Link href='/EdinburghCity'>
                        <h3>Edinburgh city</h3>
                        <p>Edinburgh city view in 2023</p>
                        </Nav.Link>
                    </Carousel.Caption>        
                    </Carousel.Item>
                                
            
        )
    }
}

这是我的页脚组件

import { MDBFooter } from 'mdb-react-ui-kit';

export default class Footer extends Component {
    render() {
        return (
            <>
    <MDBFooter sticky="bot" bgColor='light' className='text-center text-lg-left' class="fixed-bottom">
      <div className='text-center p-3' style={{
         backgroundColor: '#f8f9fa', 
         marginTop: '0.5%' }}>
        &copy; {new Date().getFullYear()} Copyright:{' '}
        <a className='text-dark' href='https://t.me/koreechdhs'>
          Boiar Kostiatyn
        </a>
      </div>
    </MDBFooter>
            </>
        )
    }
}