prevent overflow with columns and mXcomment

A forum with Tips, tricks and small tutorials.

Moderators: mcsmom, unixboymd

Forum rules
Post Reply
ewel
Joomla! Apprentice
Joomla! Apprentice
Posts: 37
Joined: Mon Oct 01, 2007 11:35 am

prevent overflow with columns and mXcomment

Post by ewel » Wed Oct 17, 2007 8:55 am

This post concerns the issue of content going out of the usual content box width and flowing under the 'left' or 'right' column in (i) templates with narrow width, (ii) 2 content columns, (iii) both a 'left' and a 'right' column, and (iv) mXcomment installed.

This issue can be solved by tackling each of the circumstances (i) to (iv), for example by using a fluid width or wide fixed width template, by reverting to one content column, or by (possibly conditionally) removing the 'left' or 'right' column, but for those who like me insist in having all in all four columns in a narrow space the solution is to change the mXcomment template. Switching off mXcomment would not be a solution for me because it is far too great an extension to do without.

mXcomment comes with three templates. In each of these there is a file "intro.php". In these files the last nested table contains the buttons or links for reviews, comments, rating, related, read more, etc. Because these buttons or links are in a table of one row, the 'line' cannot break when space runs out. Therefore the row continues and pushes the right side of the content box outside of its normal boundaries. To solve this is a matter of converting that table to a paragraph.

This is done by replacing the opening table () and row () tags with a paragraph (

) tag, and likewise for the closing tags ( and

respectively). In the opening paragraph tag add

Code: Select all

 class="publishedsection" style="white-space: normal; overflow: hidden; text-align: left; line-height:2em;"
or whatever other layout style you feel is best. Then replace every cell tag () by a span style tag as follws:

Code: Select all

<span class="publishedsection" style="page-break-inside:avoid;">
Finally, replace every cell closing tag () by this:

Code: Select all

</span> 


Now your mXcomment links or buttons will have a line break just like the rest of your content in a narrow space, and where you have set mXcomment to display links instead of buttons the links will have the style already built into mXcomment.

Sorry for not simply posting the old and new code; I do not want to affront the very kind developer of mXcomment.

Don't forget to first backup the original code!

Post Reply