Active5 years, 3 months ago
- Word For Mac - How To Put A Border Around A Text Box In Google Docs
- Word For Mac - How To Put A Border Around A Text Box In Word
![For For](/uploads/1/2/6/4/126439886/185959863.jpg)
I would like to make a text element have a border around it like this in an upcoming ghost dashboard: Ghost blog
I have done this:
however that works for the height but not the width. The width is a lot wider. I know I could set the width to something however I would like the width to update when the text is changed, so there is always a certain amount of space between the text and box on each side.
- No cable box required. No thanks Try it free. Find out why Close. How to Put a Border Around Text in a Microsoft Word Document. Microsoft Office Word Lesson #3 - Add Border around text.
- Interested to learn how to insert and format text boxes in Word for Mac 2011? This video will show you how it's done. Insert and format a text box in Microsoft Word for Mac 2011 By getexcellent; 11/2/10 9:55 AM. Wrap text around pictures in Microsoft Word: Mac 2008 Start using Microsoft Word: Mac 2008.
- By Peter Weverka. Put text in a text box when you want a notice or announcement to stand out on a Word 2016 page. Like other objects, text boxes can be shaded, filled with color, and given borders, as the examples shown demonstrate.
Step 2: Use your mouse to highlight and select the text around which you want your border. Step 3: Click the Home tab at the top of the window. Step 4: Click the drop-down menu to the right of the Borders button in the Paragraph section of the ribbon, then click the type of border that you want to use.
I'm not sure how to do this or if it needs JS or if it can be done with pure CSS.
user3235270user3235270
2 Answers
You are going to want to use padding and
display:inline-block;
on a span
element in order to do this. For example:HTML
CSS
This will allow the border around the text to shrink and grow depending on the length. It will also keep 10px of space between the border and the letters no matter the size.
Here is a fiddle: http://jsfiddle.net/ZDzn2/
Dryden LongDryden Long8,16722 gold badges2222 silver badges3737 bronze badges
If I understood you correctly, you want the border-width to be included in the css-width?!
you should then try the box-sizing attribute via CSS:
The box-sizing CSS property is used to alter the default CSS box model used to calculate widths and heights of elements. It is possible to use this property to emulate the behavior of browsers that do not correctly support the CSS box model specification.[Source: https://developer.mozilla.org/en-US/docs/Web/CSS/box-sizing]
[Source: http://css-tricks.com/box-sizing/]
Word For Mac - How To Put A Border Around A Text Box In Google Docs
mercredomercredo