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

CSS

Posted by Matt Bell
Matt Bell
197 Points

I need help with css border

Hello,

So i am new to css and i cant get my head around something i basically want a white border/box around some text which says "about me" i want it to look like a button so the border is around the text. In the code bellow i added the border but its like the full length width of the page i want it just around the text and not across the whole page.

.btn1 {
    padding-left: 900px;
    position: relative;
    bottom: 440;
    color: white;
    font-size: 20;

    border: 1px solid;
    border-radius: 3px solid;
    display:block;
}

Thanks Matt

2 Answers

Sean T. Unwin
Sean T. Unwin
28,690 Points
Sean T. Unwin
Sean T. Unwin
28,690 Points

border-radius: 3px solid; should just be border-radius: 3px;.

See boder-radius on MDN.

Sara Hardy
Sara Hardy
8,650 Points
Sara Hardy
Sara Hardy
8,650 Points

From what you wrote, I'm assuming you are using a div or span for this. 

<div class="btn1">About Me</div>

If that is the case, try changing display:block; to display:inline-block;. Also, the 900px padding is going to cause problems. Maybe you meant for that to be a margin?

Another option is to use a < button > rather than a < div >.