Help adding padding to images & text in WYSIWYG blocks

[TheGreyWizard]

So if you go to the website & see the main article at the top titled: MJBizDaily.com Crash Course Recap

https://www.ohiocannabis.com/

I created this "Featured Blog" manually with a WYSIWYG - there didn't seem to be any way to do exactly what I wanted any other way.

But the image needs some padding on the left & the title text almost seems as if it needs spaced out between the 1st & 2nd rows of it.

Anyone know exactly what I can edit in CSS so that it fixes these issues?

Thanks.

[TheGreyWizard]

Someone on a web design board said & suggested this, but I couldn't get it to work & kind of confused right now.

 

Quote

Normally we center an anchor by placing text-align:center; in the mother element, but we don't have one that don't contain other elements that are effected. So I moved the </p> up to just have the image in it. Why this didn't center the image totally is behound me, but I added a little bit to the left with margin-left:10px; in the <a>,

<div id="ipsLayout_mainArea">
<a id="elContent"></a>
<div class='cWidgetContainer ' data-role='widgetReceiver' data-orientation='horizontal' data-widgetArea='header'>
<ul class='ipsList_reset'>
<li class='ipsWidget ipsWidget_horizontal ipsBox' data-blockID='app_cms_Wysiwyg_i80e7dqpy' data-blockConfig="true" data-blockTitle="WYSIWYG Editor" data-controller='core.front.widgets.block'>
<div class='ipsWidget_inner '>
<p>
</p>
<p style="text-align:center;">
<a style="margin-left:10px" class="ipsAttachLink ipsAttachLink_left" href="https://www.ohiocannabis.com/forums/blogs/entry/19-mjbizdailycom-crash-course-recap/" rel="" style="float: left;">
	<img alt="MMJBiz.png" 
		class="ipsImage ipsImage_thumbnailed ipsAttachLink_image" 
		data-fileid="133" data-unique="2w3alen97" 
		height="314" 
		src="https://www.ohiocannabis.com/forums/uploads/monthly_2016_09/MMJBiz.png.810b6535a46a89477a0364a2c11bc4ff.png" 
		width="471">
</a>
</p>   <!-- Moved up here -->
<span style="font-size:28px;">
	<a href="https://www.ohiocannabis.com/forums/blogs/entry/19-mjbizdailycom-crash-course-recap/" rel="">
	MJBizDaily.com Crash Course Recap
</a>
</span>
<!-- </p> -->

Quote

Also took this out because it's redundant.
style="width: 471px; height: auto;"

Any ideas or suggestions? 

[TheGreyWizard]

Ok so I was able to get to the source code for that block & easily add the style="margin-left:40px" and got the buffer the image needed.

Now any ideas/suggestions on how to fix the text from crunching up against the sides?