Please, help. How do I change the background color of only the top of my web page?

Question

I can't get my pink bar to expand to the edges of the page. I want the pink bar with the title to cover the entire top and the full width but it's still surrounded by my white background.

https://code.sololearn.com/W26dCxI8J6RB/?ref=app

Answer 1

not best wa y but works try this

.design{

background-color:#ffb6c1;
background-attachment:scroll;
overflow-x:hidden;
width:110%;

margin-top:-10px;
margin-left:-10px;

}

Answer 2

It's still not working.

Answer 3

I'm on a phone using the app.

Answer 4

That definitely helped a little but how can I get rid of the side scroll?

Answer 5

Thank you so much. 😄

Answer 6

I will right down the attributes you taught me for future reference.

Answer 7

I've seen your codes. They are awesome. I've been coding for a year and I'm still on basic level.

Answer 8

make a width 104%👍👍

Answer 9

😁😁Well pratice make man perfect😁

Answer 10

i think it should help you

https://www.sololearn.com/discuss/468962/?ref=app

Answer 11

and thnx for visiting my codes

Answer 12

Your problem is that you made its height 100% also. Change your design class in CSS to the follow: (Just remove height: 100%;)

.design{
background-color:#ffb6c1;
background-attachment:scroll;
overflow-x:hidden;
width:100%;
margin:auto;
}

Answer 13

Maybe it's your browser then? After removing height: 100% it works fine for me on Chrome.

Which browser are you using? As I'm sure you've noticed by now, not forcing standards between all of the browsers is annoying for the developer side of things. lol