Joomlabamboo Support Forum :: Topic: zen-row misalignment (1/1) | Joomlabamboo

Please note that this forum is only available to you in read only mode. In order to contribute to this conversation you will need to renew your subscription.

zen-row misalignment

If you use Zentools please post a review at the Joomla! Extensions Directory.

7 years 1 month ago

I've created three column grid using zen shortcodes for zen-row. Below is the syntax I've used:

"...Retail.{/zen-4}{zen-4}Graduate Professionals on your Projects:

BimSrv employs Graduate Professionals with at least 2 years of experience in production of all types of Drawings from Presentations to Construction Documents.{/zen-4}{/zen-row}"

This results in the last column misaligned. See the attached image.
Where have I gone wrong

?

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

Hi,

It's not easy to see the issue from your screenshot.
Can you add a link to a page where we can see the problem?

Can you explain a bit further?

Regards,

Rob

Robert Went
Moderator
2210 posts
196 Thanks
Karma: 90

Last Edit: 7 years 1 month ago by Robert Went.

The administrator has disabled public write access.

7 years 1 month ago

Hi Rob,

If you notice in the attached image, the items in the columns are not in the same line. the last item is one line lower.

I have copied the syntax in my last post.

have a look at my website:
www.bimsrv.com

Thanks

Ashit

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

Do you have more than 12 items in a row?
A row can only take 12 columns.

Robert Went
Moderator
2210 posts
196 Thanks
Karma: 90

The administrator has disabled public write access.

7 years 1 month ago

Does this work?

@media screen and (min-width: 787px){
#zentools-257 .zg-col-4 {width:29%;}
}

Cheers
Paul

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

7 years 1 month ago

No. I have 3 columns, each zen-4. Each column is defined with content between {zen-4} and {/zen-4}

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

No Paul, it does not work.

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

Are you using the old zentools v1 version in the site?

I think there is a style conflict betweens shortcodes and the zentools v1 css

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

7 years 1 month ago

Can you try adding this

#zentools-257.zentools .zen-row:before {display: inherit;}

Cheers
Paul

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

7 years 1 month ago

Paul, I just updated to v3.3.3. Still the same result, no improvement.

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

No change.

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

Here's the entire code from jce editor for the article.

<h3>Advantages you get</h3>
<h4><strong>Error free, High Quality deliverables. </strong></h4>
<p><span style="font-size: 14pt;">BimSrv is an organisation that is professionaly owned and managed by Practicing Architects &amp; Engineers who have the <strong>Domain Expertise. </strong>You get drawings on time with fewer errors. Your own QC is reduced to the minimal. You actually save time and money.</span></p>
<p>{zen-row}{zen-4}</p>
<p class="zen-icon-5x" style="text-align: center;">{zen-dot-circle-o}{/zen-dot-circle-o}</p>
<h4 style="text-align: center;"><strong>Accuracy:</strong></h4>
<p>Strong Professional background enables fewer mistakes and reduces our own QC time and as a result, we're able to deliver accurate drawings with minimal errors and on time.{/zen-4}{zen-4}</p>
<p class="zen-icon-5x" style="text-align: center;">{zen-bookmark-o}{/zen-bookmark-o}</p>
<h4 style="text-align: center;"><strong>Outsourcing Experience:</strong></h4>
<p>BimSrv has over 10 years of experience in AEC Outsourcing and is familiar with Drawing &amp; Drafting Standards in the US, UK &amp; Australia.{/zen-4}{zen-4}</p>
<p class="zen-icon-5x" style="text-align: center;">{zen-graduation-cap}{/zen-graduation-cap}</p>
<h4 style="text-align: center;"><strong>Professionals on your Projects</strong></h4>
<p>BimSrv employs Graduate Professionals with at least 2 years of experience in production of all types of Drawings from Presentations to Construction Documents.{/zen-4}{/zen-row}</p>
<p>{zen-row}{zen-4}</p>
<h4 style="text-align: center;"><strong>Familiarity</strong></h4>
<p>Familiarity with Construction Methods &amp; Technologies involved in a range of Building Types including Residential, Hospitality, Health, Commercial &amp; Retail in the US, UK &amp; Australia.{/zen-4}{zen-4}</p>
<h4 style="text-align: center;"><strong>Training</strong></h4>
<p>Ongoing training &amp; Skill upgradation, that includes Products, Materials &amp; Processes prevalent in various regions as well as skill upgradation of Design &amp; Documentation software tools.{/zen-4}{zen-4}</p>
<h4 style="text-align: center;"><strong>Client Satisfaction</strong></h4>
<p>High rate of Client Satisfaction proven by long term &amp; continued relations with majority of Clients. Earliest relationships date back to the inception of BimSrv and continue till date.{/zen-4}{/zen-row}</p>

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

Hi

Can you paste above into the custom.css file as it does work for me when I do this

#zentools-257.zentools .zen-row:before {display: inherit;}

Even if it doesn't work I can check the specificity of the css to see why it doesn't

Cheers
Paul

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

7 years 1 month ago

Paul, you want me to paste the entire article code to custom css?

I've already pasted what you'd mentioned earlier...
#zentools-257.zentools .zen-row:before {display: inherit;}
to custom.css and still no change.

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

Hi Ashit,

Clearing my browser cache makes it display ok

Can you confirm?

Cheers
Paul

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

7 years 1 month ago

No it does not help. I'm using chrome, cleared cache. I also tested on Microsoft Edge, the browser I never use, also the same result. - misaligned.

I'm using maxcdn. Hope it has nothing to do with cdn cache.

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

Last Edit: 7 years 1 month ago by Ashit Goyal. Reason: additional information

The administrator has disabled public write access.

7 years 1 month ago

This is what I see in Chrome and Firefox

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

7 years 1 month ago

I added the lines in Photoshop so I could double check if it was lined up correctly

Cheers

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

7 years 1 month ago

Strange Paul,

None of my browsers show it the way it shows in your browsers, could be CDN issue. I've cleared all cache, still with the same result. Any ideas? I'll explore further.

Regards

Ashit

Ashit Goyal
12 Month basic
103 posts
1 Thanks
Karma: 0

The administrator has disabled public write access.

7 years 1 month ago

Hi Ashit,

Are on a PC?

Can you try in chrome and do Shift F5

Cheers

manh
Moderator
45248 posts
2106 Thanks
Karma: 603

The administrator has disabled public write access.

If you use Zentools please post a review at the Joomla! Extensions Directory.

Happy Campers