Homepage › Community Forums › Epik Theme Support › Proper way to center text and button Home Feature #3 Gray
I’ve hacked the following together, but have read that the tags I’m using are being discontinued. Is there a better way to code this that is more future proof?
<p><center>An on-site photo shoot, extensive photo editing and delivery of appropriately licensed images included in all proposals.</center></p>
<p><center>Request Proposal</center></p>
text-align: center;
is what you can use. Here is a link explaining – http://stackoverflow.com/questions/11478067/replacement-for-center
Thanks for the link! I looked it over and I’m not quite sure how to construct this to include the two lines I want to display in the widget.
The first line of text is: An on-site photo shoot, extensive photo editing and delivery of appropriately licensed images included in all proposals.
Then on the next line is a button: Request Proposal
Sorry, but it just isn’t clear how to go from what I had with the old HTML to the “text-align: center;” version. Could you help me format the replacement code?
Can they be in divs? If so, you can add this –
<div class="center"><p>An on-site photo shoot, extensive photo editing and delivery of appropriately licensed images included in all proposals.</p></div>
Or –
<p class="center">An on-site photo shoot, extensive photo editing and delivery of appropriately licensed images included in all proposals.</p>
Then add the styling for the “.center” class in your css –
.center {
text-align: center;
}
Thanks Kronos! Really appreciate your help 馃檪
I can try what you suggested, but I kept fooling with it and came up with this. Let me know if you think this is the best way, or at least an okay way. It seems to work, just want to make sure I’m not opening myself up for some problem I can’t foresee based on how I did this.
<p style=”text-align:center;”>An on-site photo shoot, extensive photo editing and delivery of appropriately licensed images included in all proposals.</p>
<p style=”text-align:center;”>Request Proposal</p>
If you think what you suggested is better/safer, please let me know and I’ll switch to that.
Yes that will work as well. That’s the “inline” way. Some people use css to do it if they plan to use the same code/class on multiple parts of the site and would rather manage all of them together at once, vs going through each inline code and making changes.
I would add the class and the css myself….you could also add all of the content inside one div and add the text-align: center to it and it would automatically center all of the text without having to add `style-“text-align: center;”‘ ….either way will work, just use whatever your comfortable with.
I took your advice and added the class to my css. I put it at the bottom of the 02 Defaults section… don’t know if that matters or not.
Here’s the exact code I used in the widget:
<div class=”center”><p>An on-site photo shoot, extensive photo editing and delivery of appropriately licensed images included in all proposals.</p>
<p>Request Proposal</p></div>
Only used one div as you suggested. Let me know if you see any errors. Can’t tell you how much I appreciate your help!!
Looks fine to me.