[TTSSParticipant]

Hi guys,

I’m currently developing the following product page and it seems that there is an problem with the content of the product short description.

As you can see, the content of the description (buttons and columns inside the green section) is not aligned; if you try to perform an inspect on the generated code and explode the content of the <div itemprop="description"></div>, you will notice that are added several <br> elements inside of it.

<div itemprop="description">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam lacinia, diam et tincidunt vulputate, lorem nibh imperdiet velit, eu congue nisl tellus vitae mauris. Fusce et tincidunt turpis. Proin vitae purus laoreet, lobortis mauris a, rutrum neque. Donec mauris diam, fringilla vitae neque et, vulputate feugiat nibh. Duis ac commodo risus. Nam tincidunt maximus purus. Cras consectetur arcu turpis, in dapibus lacus euismod sit amet.<br>
</p><div id="x-content-band-1" class="x-content-band border-top border-left border-right border-bottom" style="background-color: transparent; padding-top: 0px; padding-bottom: 0px;"><div class="x-container"><br>
<a class="x-btn x-btn-square x-btn-mini alignleft" href="#" data-options="thumbnail: ''">FLOAT ME LEFT</a><br>
<a class="x-btn x-btn-square x-btn-mini alignright" href="#" data-options="thumbnail: ''">FLOAT ME RIGTH</a><br>
<hr class="x-clear"><br>
</div></div><br>
<div id="x-content-band-2" class="x-content-band border-top border-left border-right border-bottom" style="background-color: #034624; padding-top: 0px; padding-bottom: 0px; color: #fff;"><div class="x-container max width"><br>
<div class="x-column x-sm x-1-2" style=""><br>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam lacinia, diam et tincidunt vulputate, lorem nibh imperdiet velit, eu congue nisl tellus vitae mauris.<br>
</div><br>
<div class="x-column x-sm x-1-2 last" style=""><br>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam lacinia, diam et tincidunt vulputate, lorem nibh imperdiet velit, eu congue nisl tellus vitae mauris.<br>
</div><br>
</div></div><p></p>
</div>

Is it normal?

I’ve found a workaround in jQuery but I don’t know if it is the best and safe way to solve it. Here is the code:

jQuery(document).ready(
    function($) {
        $(function() {
            $('div').attr("itemprod","description").find('br').remove();
        });
    });

Thank you so much for your time and support.

[NicoModerator]

Hi There,

Would you mind sharing your admin credential so we could check it closer.

Don’t forget to set it as private reply.

Thanks.

[TTSSParticipant]

This reply has been marked as private.

[ChristopherModerator]

Hi there,

I copied your shortcodes in description section and tested them on my end, and I got the same result.

Please do not put space between shortcodes to prevent this, you can try this code instead :

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam lacinia, diam et tincidunt vulputate, lorem nibh imperdiet velit, eu congue nisl tellus vitae mauris. Fusce et tincidunt turpis. Proin vitae purus laoreet, lobortis mauris a, rutrum neque. Donec mauris diam, fringilla vitae neque et, vulputate feugiat nibh. Duis ac commodo risus. Nam tincidunt maximus purus. Cras consectetur arcu turpis, in dapibus lacus euismod sit amet.
[content_band padding_top="0px" padding_bottom="0px" border="all"][button shape="square" size="mini" float="left" info="none" info_place="top" info_trigger="hover"]FLOAT ME LEFT[/button][button shape="square" size="mini" float="right" info="none" info_place="top" info_trigger="hover"]FLOAT ME RIGTH[/button][/content_band][content_band inner_container="true" padding_top="0px" padding_bottom="0px" border="all" bg_color="#034624" style="color: #fff;"][column type="one-half" fade_animation="in" fade_animation_offset="45px"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam lacinia, diam et tincidunt vulputate, lorem nibh imperdiet velit, eu congue nisl tellus vitae mauris.[/column][column type="one-half" fade_animation="in" fade_animation_offset="45px" last="true"]Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam lacinia, diam et tincidunt vulputate, lorem nibh imperdiet velit, eu congue nisl tellus vitae mauris.[/column][/content_band]

Thanks.

[TTSSParticipant]

It works!

Thanks.

[ChristopherModerator]

You’re welcome 🙂

[Author]

Posts