How can you center a bordered paragraph in HTML?
This is a bit of a tricky question, and I needed to show pictures, so I had to make it as a blog. I was trying to make my own "button" by putting some text inside a border and making a clickable link within it.
I can center the text within the border, but I can't make the bordered text center on the post.
As you can see, it's aligned to the left here. I used this exact html to get what you see above:
<h3 style="border: 1px solid #808080; width: 300px; text-align: center;"><span style="font-size: 16pt;">Did I have you at "free"?</span>
<span style="font-size: 14pt;"><a href="https://moneymakingmama.org/wa" >»Sign up for free by clicking here«</a></span></h3>
I have tried just adding a <center></center> before and after the h3 tag but nothing happens. Anything else I could try?
Recent Comments
13
Heather, this is how you can center your bordered paragraph. It works, and to make sure, I copied your html into my trial website and it centered.
Place this code
At end end of the code place
My pleasure Heather. I'm pleased to be of help. I also sent you a PM and included a screenshot. So please ignore the PM.
All the best :)
Learning that during school days, how to following paragraph, the start, center and the block your
sentence, in hot mail i have no idea, yet is a learning!
Hi Heather,
To help you I would need to see more of your coding.
But why not designing a button. It would probably look better.
If you don't have a design program yet, get getpaint.net. It's free and pretty powerful!
I'll have to check it out!! I had downloaded a plugin I thought I could use for buttons within my posts, but for some reason, they only work as widgets. And I hate having to go to a different program every time I want to change something about the button, that's why I was trying to do it with HTML instead. But I use GIMP mostly, so I just made a quick image with that.
I've been using it for a while!! I used Photoshop before that so I already had a bit of an idea how it worked, but it does definitely take some getting used to, very different from anything I've used before, for sure. I use it and Canva for most of my pictures and featured images on my sites.
Perhaps the problem is because you're using H3. The easiest fix would be to create the text as an image at http://canva.com then you can position the image wherever you want.
Another option would be to use TinyMCE Advanced or another plugin that formats text. Change Fonts and More with Tiny Mice Next time you want to insert an image in a question use the "search" box at the top of the page instead of the pen icon.
I feared that would be the only way to get it to be centered. I do have TinyMCE but wasn't able to do what I was trying to achieve with it. I figured I'd have to just make an image anyways. Thanks for the input!
See more comments
I saw your web sites there are awesome. Not only content is unique, but font is more then excellent, I would like to ask you what program you use for this font?
Thank you so much, love! I use the plugin Easy Google Fonts for ease of access, but you can totally use coding to get the same results. I am just using this until I decide on my forever theme... I'm having difficulties finding the one I like the best, but I just switched to this one and am ironing out the kinks as we speak.
Thank you so much!!!