how to make a text box frame?

User 2203084 Photo


Guest
15 posts

hi, a really easy question for someone i rekon! cant work out how to make a framed text box so it stands out on the page,
any help please,
thanks a lot
lisa
User 187934 Photo


Senior Advisor
20,193 posts
Online Now

Hi Lisa, Try this code. Paste it into the Body HTML of the HTML tool.

<div style="width:200px;height:100px;border:2px solid blue;"><div align="center"><p><font size="5" face="@Arial Unicode MS" color="#FF6600"><b>Here's your text</b></font></p></div>


If you have trouble with other things miss aligning after placing the code, you can place the code just for the box then using VSD's standard text box tool add your text on top of the HTML box that shows in the design window.

<div style="width:200px;height:100px;border:2px solid blue;"></div>
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 2203084 Photo


Guest
15 posts

thanks Eric,
there's not just something to click in vsd for it then!?!? miss aligning freaks me out!
User 271657 Photo


Ambassador
3,816 posts

In VSD, there's the Shapes tool - click and drag a shape anywhere on your page. The blue and grey boxes near the bottom of this page are examples:
http://bigbendvet.com/
There are other shapes and an open frame available. You could also make something in a graphics program and use the Image tool to insert it. Trying to get VSD text placed perfectly over an HTML object would be a challenge :D.
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 187934 Photo


Senior Advisor
20,193 posts
Online Now

Hi Paintbrush, Why do you say it's a challenge to place a text box over an html box?
I can't hear what I'm looking at.
It's easy to overlook something you're not looking for.

This is a site I built for my work.(RSD)
http://esmansgreenhouse.com
This is a site I built for use in my job.(HTML Editor)
https://pestlogbook.com
This is my personal site used for testing and as an easy way to share photos.(RLM imported to RSD)
https://ericrohloff.com
User 271657 Photo


Ambassador
3,816 posts

Because where you see the box in VSD is different from how the object actually displays. If I line up the top of an HTML box with a line of text (in VSD), then preview, they wont be lined up and I need to take some pixel measurements on screen to see how much I need to nudge the box to get it in place. I guess this is because on screen you see the contents of the box, while in VSD you see just the box/placeholder and can't see where the actual content is in relation to the edges of that box.
I've had some glitchy stuff happen with text overlapping HTML objects before (the infamous "bad argument" warning :o), as well as what different browsers do to VSD text overlapping HTML objects (and images), so I just avoid the nasty surprises and keep my HTML boxes all by themselves :lol:
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com
User 271657 Photo


Ambassador
3,816 posts

One other thing, that's easy to do in VSD...
Make a box that's the color you want the frame to be. Then make another, smaller box that is the color of your page and put it in front of the first box. Adjust the size so your "frame" looks right to you, then group the two boxes. Create your text and position it - you can also add it to the group to make sure it will stay in place no matter the browser used.
I love deadlines. I like the whooshing sound they make as they fly by. (Douglas Adams)
https://www.callendales.com

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.