lrefopam
lrefopam

Reputation: 531

border-radius for background created with linear-gradient

in my react project I created a background for the whole application. Unfortunately, I can't add round corners with border-radius. Can someone please help me with this?

App.scss

html {
  background: linear-gradient(to bottom right, #c9d2f0 10%, #ffe7bf 80%) no-repeat 95% 50%;
  border-radius: 0.8125rem;
  height: 100%;
  margin-left: 1rem;
  margin-right: 1rem;
  margin-top: 1rem;
  margin-bottom: 1rem;
  padding-top: 2rem;
  width: auto;
}

Upvotes: 0

Views: 133

Answers (2)

Fischbrot
Fischbrot

Reputation: 828

Try to use a container/wrapper and style on it.

Like this you have way more control over the style instead of styling the tag.

Upvotes: 0

Mu-Majid
Mu-Majid

Reputation: 845

My understanding is that you're trying to make every element in your html doc to have a border radius through inheritance. Well, that is not possible, because border-radius property is not inherited

It is always better to apply such properties on elements directly (via classes or any selector you see fit)

Let me know if I misunderstood your question.

Upvotes: 1

Related Questions