Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML Introduction to HTML and CSS (2016) HTML: The Structural Foundation of Web Pages and Applications Paragraph Tags

jasgra
jasgra
1,734 Points
Posted by jasgra
jasgra
1,734 Points

How can make a change to the default margin for the paragraph tag?

I believe the standard margin is 16px. Say I want to make it 5px, how can I do this?

I may be mistaken, but when I add an attribute to the tag > That refers to the css file. I add a new top and bottom margin for the <p(aragraph)>. This doesn't seem to do the trick.

I know that the largest margin overwrites the lower one. But apparently I doing something wrong.

Can you please answer my question. Thank you in advance!

Kathryn Notson
Kathryn Notson
25,941 Points

jasgra:

Show your Workspaces code so everyone can see how it's written. You don't add an attribute to <p> tags inside the index.html file. The CSS styles it.

To give your paragraph a margin, you would write it in your styles.css file as: p { margin: 16px; }; or p { margin: 5px; }. Remember, cascading style sheets means that if the first margin is 16px, then you change the margin later to 5px, the latter margin overrides the previous margin.

2 Answers

Richard Crazythunder
Richard Crazythunder
2,323 Points
Richard Crazythunder
Richard Crazythunder
2,323 Points

In your CSS section in the head of your HTML file (or the CSS file) you can define the parameters of a <p> element like this: p { margin-top: 100px; margin-bottom: 100px; margin-right: 150px; margin-left: 80px; }

Does that help? For future reference, w3schools.com is an excellent source of information and reference guide for all things related to fundamental HTML/CSS

jasgra
jasgra
1,734 Points
jasgra
jasgra
1,734 Points

Yeah thank you. Because of all the class attributes (and css selectors) and overwriting one another, it was quite a search to get it right.

But it worked!

Also @ Kathryn Notson: Thank you!

Kathryn Notson
Kathryn Notson
25,941 Points
Kathryn Notson
Kathryn Notson
25,941 Points

jasgra:

You're welcome.

Also, when you have margins for each side of an element, start with the margin-top, margin-right, margin-bottom, then margin-left. It's always clockwise if you use 4 separate units. Here's a link to help you: http://www.w3schools.com/css/css_margin.asp.

Happy coding!