0

I need some help to put my background portfolio color in white. I tried to do it by putting a global css but on both sides of the page I have a black background and I can´t change it.

return (
    <>
    <Navbar />

    <main className="main">
        {title && (
            <h1 className="bg-light">
                {title}
            </h1>
        )}
        {children}
    </main>

                            {/* - {new Date().getFullYear()} */}
    {
        footer && (
            <footer className="bg-dark text-light text-center">
                <div className="container p-1">
                    <h6>&copy; Juan M. Grehuello Portfolio</h6>
                    <p>2022. All rights reserved</p>
                </div>
            </footer>
        )
    }
</>
);

And my css is like:

.main {
background-color: white;
padding: 2px;
margin-left: 107px;
margin-right: 107px;

}

Juan Grehuello
  • 1

1 Answers1

2

A simple look at the documentation would have been enough. Here is the link:

https://getbootstrap.com/docs/5.0/utilities/background/

Apparently, you can set the background color with:

.bg-light

This means you have to wrap your component into:

<div className="bg-light">
  ...
</div>
micartey
  • 128
  • 6