From the course: Creating a Responsive Web Design

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Styling the atmosphere section

Styling the atmosphere section - CSS Tutorial

From the course: Creating a Responsive Web Design

Start my 1-month free trial Buy for my team

Styling the atmosphere section

“

- Now that we have our section main complete, we're going to start to style the section for atmosphere. So back to our CSS, let's hit a few Returns. I'll add another CSS comment for section atmosphere. So the first row we're going to create, we'll type section.atmosphere, put in our brackets. We're going to set a background-color here. We're going to set a background-color, this is going to be the orange color. So we use hexadecimal, #CC for red, 66 for green, 33 for blue;space. Next, we're going to set padding-top, we're going to set this to 30 pixels. Next, we'll set padding-bottom, we'll set this to 30 pixels as well. So that we have a consistent color fill above and below the content. And then finally let's set color to #fff for white. Let's go test this in a browser. Now we can see our orange color. We can also see the anchor tag with the classic btn and notice I can hover over this and I get an animation back to that 30% black background color. Just like what we have up in the…

Contents