Changing size of border around section of post

• 

  travelerwellness · Member · Sep 16, 2014 at 8:29 am

  • Copy link
  • Add topic to favorites

  Hi Brains of wordpress,

  I added a border around a section of text not through CSS <div style=”border:3px solid blue;padding:1em;”><p style=”margin-top:5px;margin-bottom:5px;”>your text here</div>

  but i’m having problems understanding how to reduce the size of the border as it’s too wide across the page.
  I’m also having problems aligning the text to wrap around a picture inside the border.

  The page is http://travelerwellness.wordpress.com/clinic/profile/

  Thanks for any help

  The blog I need help with is: (visible only to logged in users)

• 

  1tess · Moderator Emeritus · Sep 16, 2014 at 9:29 am

  • Copy link

  As for aligning images,
  you have set them to alignnone so your text won’t wrap around to the right of the picture
  Edit the images to alignleft instead.
  http://en.support.wordpress.com/images/image-alignment/

  As your your border your source code looks like this:

  <div style="border:1px solid grey;padding:3em;">
  <p style="margin-top:5px;margin-bottom:5px;"><span style="color:#ed9e0c;">WHAT IS TRAVELER WELLNESS?</span></p>
  <p style="margin-top:5px;margin-bottom:2px;">Find out more about Traveler Wellness</p>
  <p style="margin-top:5px;margin-bottom:5px;"><a title="Traveler Wellness" href="http://wp.me/P4SmfN-5W"><img class="alignnone  wp-image-337" src="http://travelerwellness.files.wordpress.com/2014/09/learn-more.png?w=94&h=38" alt="learn more" width="94" height="38" /></a></p>
  </div>

  Try changing the div padding to px instead of em: 2px; maybe? I guess I don’t understand what you want to change? is it the amount of padding inside the border?

• 

  travelerwellness · Member · Sep 16, 2014 at 5:56 pm

  • Copy link

  Hi 1tess,

  Thank you for your response. I guess I should be more clear, sorry about that.
  I want to know how to reduce the width (horizontal) of the border box because I only have a few words with this oversized box around it.

  Patient info

  thank you once again.

• 

  1tess · Moderator Emeritus · Sep 16, 2014 at 9:00 pm

  • Copy link

  This code should center your div in the content area.
  <div style="border:1px solid grey;width:33%;padding:5px;margin-left:17%;">TEXT IMAGE CONTENT HERE</div>

  IMNSHO, I found the white space in the box restful. So many sites try to fill every pixel with stuff my brain has learned to ignore. The simplicity makes the text (and I also liked the pictures) assume importance.

  Let me know if that works…

• 

  travelerwellness · Member · Sep 18, 2014 at 2:16 pm

  • Copy link

  Thank you 1tess for your generous advice. You were right, it does look better with some space. So I decided to keep it as it is.

• 

  1tess · Moderator Emeritus · Sep 18, 2014 at 2:49 pm

  • Copy link

  You are welcome!