FAQ: The Box Model - Introduction to the Box Model

Frequently Asked Questions CSS FAQ
1

Community%20FAQs%20on%20Codecademy%20Exercises
Community%20FAQs%20on%20Codecademy%20Exercises1000×208 141 KB

This community-built FAQ covers the “Introduction to the Box Model” exercise from the lesson “The Box Model”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Web Development

Learn CSS

FAQs on the exercise Introduction to the Box Model

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head here.

Looking for motivation to keep learning? Join our wider discussions.

Learn more about how to use this guide.

Found a bug? Report it!

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!

3

I noticed in the style.css file something strange for me
so here,

body {
  background-color: white;
  font-family: 'Raleway', sans-serif;
}

isn’t the background default white ? so what is the important of this line ?
background-color: white;

4

I noticed in the style.css that in the classes /.share a/ and /.share a:hover/ the property used to change the background color isn’t background-color: but just background:.

Is that also ok?

5

what is tle link below title in the head for??? Introduction to the box model . lesson

1 Like
6

You are referring to this exercise.

In index.html, there is a link below the title,

<title>The Terminal - Your Source for Fact-Based News</title>
  <link href="https://fonts.googleapis.com/css?family=Amatic+SC|Raleway:100,200,600,700" rel="stylesheet">

There are many free/open-source fonts made available by Google.

You can browse them at https://fonts.google.com

The link you mentioned allows the use of Amatic SC and Raleway fonts to style our webpage. You can go to the Google Fonts page and browse/search the fonts. You can select multiple fonts and then click on “View selected families”. There you will see links that you can use in the head of your webpage to link to these fonts. In style.css, you can see that the font-family for body has been specified as Raleway.

1 Like
7

thank’s a lot i got it :wave:

1 Like
8

In the Olivia Woodruff Portfolio Project, the link to the image
image link

It’s just showing blank white page, i think maybe it’s not working could you please see into this @mtf
I’m sorry to bother you again sir.

9

Your link does lead to an image. Can we see your code and perhaps zero in on the problem?

10

image
image1366×654 211 KB

11

I see the background image. What is it that I don’t see?

12

I thought something was there and now it was showing just a empty page.
As the name of the image was Hypnotize so i thought maybe something was missing.

Sorry my bad… Sorry to bother you sir.
Thankyou for helping me.

1 Like
13

No problem. You should know that I have no authority, and no influence on the CC team. We’re only neighbors, here.

1 Like
14

Ohhh i didn’t knew that

1 Like
15

The default background color for an HTML document or an element depends on the browser’s default styles. Browsers have their own default styles, and they may set different default background colors for the body element or other elements.

In general, the default background color for the body element is often white, but this can vary slightly between browsers. It’s important to note that these default styles are part of the user agent stylesheet provided by the browser.

16

``background-color` refers to the background color

background is shorthand to combine many background tags into one line.

background: #ffffff url("img_tree.png") no-repeat right top;

Combines color, image and background image properties in the one line instead of typing our each style individually.