Help with font(Will not display)

1

Hello, I am having a little trouble trying to get my font to display for all of my paragraphs, can anybody spot what I am doing wrong? thanks :slight_smile:

2

Hey there! you forgot to link the lobster font.

<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Lobster" / check the link missing a greater than sign. could not post full link dont know why..

add the link in the top of your html.
and style it in css by using this code:

body {
font-family:Lobster;}

here are some tips for styling your body:
body {
font-family:Lobster;
font-size: 27px;
margin: 0 auto;
max-width: 960px;
padding: 40px 10px;
line-height: 1.65em;
background: #000E;
color: #333;
font-weight: 100;
}

4

I have added the link to the font like you advised and styled in css as:

body {font-family:lobster;}

But it still is not changing, Iā€™m clearly doing something wrong :smiley:

any idea? Thanks

5

remove all your old code from css and only keep the snipet i gave you. works fine here after i do it on your codepen:)

body {
font-family:Lobster;
font-size: 27px;
margin: 0 auto;
max-width: 960px;
padding: 40px 10px;
line-height: 1.65em;
background: #000E;
color: #333;
font-weight: 100;
}

6

Thank you, that worked, did not know I had to link to font at the top of the page. One question if I may? How can I get the white border effect i had back? Thanks

7

#background {background-color:black;
margin:0;
padding:0;
}

body {
font-family:Lobster;
font-size: 27px;
margin: 0 auto;

padding: 25px;
padding-top:10px;
line-height: 1.65em;
background: :white;
color: white;
font-weight: 100;
}

p {
max-width:960px;

}

like this? if you want the padding bigger or smaller just edit the px value in the body.

8

Yes like that, I was not sure how to do it myself, regarding the

#background color, is that the same thing as the background color in the body{} section? is it possible to have a background on top of a background? ie: Black main background with a layer of another background on top(say grey for example) Iā€™m trying to experiment with background colors in different sections if that is possible.

I have seen other posts in this forum where it looks like this, but I cant for the life of me work out how?

Sorry for the long message and thank you for your help :slight_smile:

9

https://codepen.io/a-koldal/pen/VxOjaN

go here and copy the code, if you want to. added a grey color in the top and added a grey footer in the bot

its a bit hard to explain im only two weeks inn myself. but yes you can colors anywhere, just wrap them inside a div element. and hit them up in css :slight_smile:

10

Iā€™m 3 days in now so its a bit of a whirlwind trying to learn/remember everything.

Thank you ill take a look :slight_smile:

1 Like
11

cant remember everything, just try to take some good notes.
Anytime
Good luck! :sunny: :slight_smile: