Source: https://divicake.com/blog/align-the-blurb-icon-to-the-right-in-divi/ [Blog](https://divicake.com/blog/)/[Tips & Tricks](https://divicake.com/category/tips-tricks/) # How to Align the Blurb Icon to the Right in Divi By Divi Cake·28 November 2023·Updated 7 January 2026·3 min read By default the Divi blurb module allows you to align the image/icon to the top or left. We may earn a commission from affiliate links in this post. [Disclosure policy](https://divicake.com/affiliate-disclosure-policy/) On this page - [What are the Default Choices?](https://divicake.com#what-are-the-default-choices) - [Step 1: Tweaking the Blurb Module Settings](https://divicake.com#step-1-tweaking-the-blurb-module-settings) - [Step 2: Adding CSS Class To The Blurb Module](https://divicake.com#step-2-adding-css-class-to-the-blurb-module) - [Step 3: Adding CSS Code Snippets To The Blurb Module](https://divicake.com#step-3-adding-css-code-snippets-to-the-blurb-module) - [Final Result:](https://divicake.com#final-result) - [Final Thoughts:](https://divicake.com#final-thoughts) Usually, when you’re using the [Divi blurb module](https://divicake.com/blog/how-to-rearrange-divi-blurb-module/), you can only put the image or icon on the left or at the top. Not everyone goes for these choices, but we’ve seen other WordPress builders make some cool designs using them. It’s about trying things out and finding what suits your design style. So, come along with us in this guide where we will take you through each step to move the icon to the right in the [Blurb module](https://divicake.com/blog/how-to-increase-the-divi-blurb-content-width/). It’s a problem many of us have faced, but don’t worry – we’re about to figure it out together! Let’s jump into the steps and give your design a little boost with a right-aligned icon in the Blurb module. ## What are the Default Choices? Before we go any further, let’s check out the basic options in the [Divi blurb module](https://divicake.com/blog/replacing-divi-blurb-icon-with-font-awesome-icon/) for putting the icon or image in place. Typically, in the Divi blurb module, you’re limited to placing the image or icon either on the left or at the top. Default options for putting the icon or image in place Now, in the next part, we’re going to walk you through each step, showing you exactly how to align your [Divi blurb](https://divicake.com/go/how-to-add-advanced-hover-effects-to-divis-blurb-module-using-hover-css/) image or icon to the right. Ready to make it happen? Stick around for the simple steps ahead! ## Step 1: Tweaking the Blurb Module Settings To begin, click on the Blurb Module settings. Next, navigate to Design, then Icon, and select Alignment. Set it to Left. We have included a screenshot to guide you on exactly where to find this option. Blurb Settings> Design > Icon > Alignment Alignment of blurb module icon/image to the left. Tweaking the Blurb Module Settings Read More: [Replace the Divi Blurb Icon With a Font Awesome Icon](https://divicake.com/blog/replacing-divi-blurb-icon-with-font-awesome-icon/) ## Step 2: Adding CSS Class To The Blurb Module Open the blurb module settings, then head to the Advanced tab. In the Custom CSS IDs & Classes toggle, add a custom [CSS](https://divicake.com/blog/how-to-add-custom-css-to-divi/) class named ‘blurb-right’. If you are not sure where to add the class then please check the screenshot below: Assigning a custom CSS class to the Divi Blurb makes it sure that our code only changes one blurb module, not all of them on the site. Adding custom CSS class named ‘blurb-right’ We’re assigning a special class to make sure our code only changes one blurb module, not all of them on your site. If you’re planning to shift the icon to the right for more than one blurb, just tag each of them with the class “blurb-right.” It’s like giving each blurb a little instruction so they all know to move their icons to the right. ## Step 3: Adding CSS Code Snippets To The Blurb Module Now that your module is all set up, the last step is adding the [CSS](https://divicake.com/blog/how-to-add-custom-css-to-divi/) code to shift the icon to the right. Head over to your Dashboard, click on Divi, then Theme Options, and finally, Custom CSS. Once you’re there, simply paste in the following CSS code. It’s like giving your website a little instruction manual for moving those icons where you want them. Let’s make it happen! .blurb-right.et_pb_blurb_position_left .et_pb_blurb_content { display: flex; flex-direction: row-reverse; } .blurb-right.et_pb_blurb_position_left .et_pb_main_blurb_image { width: auto; } .blurb-right.et_pb_blurb_position_left .et_pb_blurb_container { padding-left: 0px; padding-right: 15px; } Here is a screenshot to show you exactly where to add the CSS code. Head over to your Dashboard, click on Divi, then Theme Options, and finally, Custom CSS. Adding CSS Code Snippet to the Divi Dashboard ## Final Result: By default Divi doesn’t allow the placement of icon/image to the right. Alignment of the Divi icon to the right Read More: [Adding a Scroll Down Hover Effect in Divi Website – Step-by-Step Guide](https://divicake.com/blog/divi-scroll-down-hover-effect-guide/) ## Final Thoughts: Wrapping up our guide, you’ve successfully gone through the steps to move the [Blurb icon](https://divicake.com/blog/replacing-divi-blurb-icon-with-font-awesome-icon/) to the right in Divi. Now, you have the power to break away from the usual options and give your website a unique look in the world of web design. By exploring the Blurb module settings, adding a special CSS class, and applying the provided CSS code, you can adjust where your icons sit on the page. This small change can really boost the overall appearance of your website. Keep in mind, web design is all about trying things out. Feel free to play with these tricks, whether you’re working on your own blog or helping someone else with their site. Being able to tweak details like icon placement adds a professional touch to your work. If you found this guide useful, share it with others who love working with Divi. Happy designing! Read More: [Mastering Divi: Tips and Tricks for a More Efficient Web Design Experience](https://divicake.com/blog/mastering-divi-for-better-web-design/) ## Written by Divi Cake Divi 5 tutorials, layouts and fixes from the team that builds Divi sites every week. - [About Divi Cake](https://divicake.com/about/) ## Get the Divi Cake newsletter New Divi tutorials and Divi Cake product news, by email. First name (optional)Email Company website SubscribeSubscribeSubscribe Unsubscribe any time. [Privacy policy](https://divicake.com/privacy/) The sign-up form needs JavaScript for its spam check. Almost done. Click the link in the email we just sent to confirm your subscription. If you are already subscribed, there is nothing more to do. ## Submit a comment Comments are read before they appear. Your email is not published. Comment NameEmail Company website Submit commentSubmit commentSubmit comment The comment form needs JavaScript for its spam check. Thanks. Your comment is waiting for review and will appear here once it is approved. ## Do you need help with … - [Divi 5 migration](https://divicake.com/divi-4-to-divi-5-migration/) - [Divi websites](https://divicake.com/divi-website-development/) - [Divi plugins](https://divicake.com/divi-plugin-development/) - [Fix a site](https://divicake.com/fix-existing-site/) - [Beyond Divi](https://divicake.com/beyond-divi/) - [Technical SEO](https://divicake.com/technical-seo/) - [SEO content](https://divicake.com/seo-content/) ## Newsletter New Divi tutorials and Divi Cake product news, by email. First name (optional)Email Company website SubscribeSubscribeSubscribe Unsubscribe any time. [Privacy policy](https://divicake.com/privacy/) The sign-up form needs JavaScript for its spam check. Almost done. Click the link in the email we just sent to confirm your subscription. If you are already subscribed, there is nothing more to do. ## Save Annually on Divi [Save 69% on Divi VIP](https://divicake.com/go/divi-vip/)[Save 69% on Divi Cloud](https://divicake.com/go/divi-cloud/)[Save 69%, Divi Team](https://divicake.com/go/divi-teams/) ## WordPress Hosting & Tools [100% off on Kinsta for 1 Month](https://divicake.com/go/kinsta/)[Get up to 62% off Bluehost hosting.](https://divicake.com/go/wordpress-hosting-blue-host/)[Save Up to 15% on Rank Math](https://divicake.com/go/rank-math/)[Get 50% OFF on all WPForms plans](https://divicake.com/go/wpforms/) ## More in Tips & Tricks [ 5 Awesome Uses for Divi's Dynamic Content Tips & Tricks5 min read ### 5 Awesome Uses for Divi's Dynamic Content Five Divi layouts — travel, recipes, car rentals, clothing and product reviews — rebuilt as reusable templates with dynamic content. 29 October 2026](https://divicake.com/blog/divi-dynamic-content/) [ Customizing Divi for advanced WordPress development projects Blogging4 min read ### Customizing Divi for Advanced WordPress Development Projects Seven ways to take Divi past its stock settings on an advanced build: custom CSS and JavaScript, child themes, integrations, hooks and filters, and performance work. 11 October 2026](https://divicake.com/blog/customizing-divi/) [ Divi Condition Options Explained Tips & Tricks6 min read ### Divi Condition Options Explained How Divi condition options work: show or hide any section, row, column or module by post info, location, user, interaction, device or WooCommerce state. 3 October 2026](https://divicake.com/blog/a-look-at-the-new-divi-condition-options/)