Image right alignment with column text
- This topic has 6 replies, 2 voices, and was last updated 5 years, 9 months ago by
.
-
Posts
-
Can someone please give me the code for aligning an image in the right column of a Charity Theme front page section?
Here’s a screen shot that shows what I’m referring to.
I tried this code, but it puts the image below the text instead of the right side.
</div>
[/column_content][column_content type=”one_half_last”]![](data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20width='640'%20height='"320”'%20viewBox='0%200%20640%20"320”'%3E%3C/svg%3E)
[Column_content]Hi Bakari,
Use this below shortcode content in Section 2 for to display image in right side
[column_content type="one_half"] <div class="best-featurs"><i class="fas fa-dollar-sign"></i> <h4>DONATE MONEY</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... </div> <div class="best-featurs"><i class="far fa-heart"></i> <h4>BECOME VOLUNTEER</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... </div> <div class="best-featurs"><i class="fas fa-location-arrow"></i> <h4>SPONSORSHIP</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... </div> [/column_content][column_content type="one_half_last"]<img src="http://yoursite.com/wp-content/themes/charity-help/images/slides/slider1.jpg" />[/column_content]Please check the documentation
https://gracethemes.com/documentation/charity-help-doc/#how-to-helpRegards
Grace ThemesAwesome, thanks for that code. It definitely aligns the picture to the right, but I don’t want the icons on the left for each bullet item. When I tried removing those code snippets for the icons, it ended up putting the picture back at the bottom of the text. Can you give me the code without the icons code?
Sorry I don’t know enough about CSS to figure it out myself. I didn’t realize when I bought this theme that I would have know the coding. But it’s good to know where the sample coding is for us.
Also, without the icons, is there a way so that the bullet text don’t come up the edge of the page? How can I get them to move over using css code?
Here’s what I’m referring to:
https://cl.ly/c0649a35909bHere’s the webpage where the section is located: https://dignityinschools-ca.org
Hi
If you don’t want to use small icons, just remove the code:
<i class="fas fa-dollar-sign"></i>So modified code is
[column_content type="one_half"] <div class="best-featurs"> <h4>DONATE MONEY</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... </div> <div class="best-featurs"> <h4>BECOME VOLUNTEER</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... </div> <div class="best-featurs"> <h4>SPONSORSHIP</h4>Proin nec gravida purus. Curabitur effici elementum dolor dapibus, nec maximus augue iaculis. In tincunt eget diam ac vulputate... </div> [/column_content][column_content type="one_half_last"]<img src="http://yoursite.com/wp-content/themes/charity-help/images/slides/slider1.jpg" />[/column_content]Regards
Grace Themes
[Column_content]
- You must be logged in to reply to this topic.
