• 0
Sign in to follow this  
Followers 0

Responsive Grid - photos not lining up with images

Question

Posted · Report post

Hello,

 

I've been using Responsive Grid to line up photos and text. The pictures, however, are lined up higher than the text (screen shot attached). How can one make sure that the pictures align towards the top of each grid so that they are lined up with the beginning of the text in each grid?

 

 

 

Share this post


Link to post
Share on other sites

5 answers to this question

  • 0

Posted · Report post

If you read the instructions for Responsive Grid, you can use zmb or zmt to align content to bottom or top (respectively).

 

Look at the Note under Nested Grid here  http://docs.pagelines.com/tutorials/responsive-grid

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Rob,

 

I tried that, to no avail.

 

This is the code I've used:

 

<div class="row">
<div class="span2 zmt zmb"><a href="http://www.cambridgenaturals.com/wp-content/uploads/2011/02/adaptostress.jpg"><img class="aligncenter  wp-image-4849" alt="adaptostress" src="http://www.cambridgenaturals.com/wp-content/uploads/2011/02/adaptostress.jpg" width="200" height="200" /></a></div>
<div class="span10 zmt zmb">
<h5>Michael Kanter, Co-Owner recommends:</h5>
<h4>Adaptostress Energy by ReserveAge</h4>
Energy and stress, anyone need the former or have too much of the latter? This is an outstanding herbal super supplement. Featuring, rhodiola, schisandra and ashwagandha, adaptogens that "promote healthy balance". It's great for me in the morning before a brisk walk or vigorous bike ride. In my mind it is the perfect September "let's start the season off right" product!!

 

The text is still showing up lower than the photo height.

 

Emily
 

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Emily, you can't use both zmt and zmb together.  The browser won't know whether to move up or down.  One or the other works.

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

Hi Rob,

 

I removed the zmb and still it is not lining up properly:

 

<div class="row">
<div class="span2"><img src="http://www.cambridgenaturals.com/wp-content/uploads/2011/02/adaptostress.jpg" width="200" height="200" /></div>
<div class="span10 zmt">
<h5>Michael Kanter, Co-Owner recommends:</h5>
<h4>Adaptostress Energy by ReserveAge</h4>
Energy and stress, anyone need the former or have too much of the latter? This is an outstanding herbal super supplement. Featuring, rhodiola, schisandra and ashwagandha, adaptogens that "promote healthy balance". It's great for me in the morning before a brisk walk or vigorous bike ride. In my mind it is the perfect September "let's start the season off right" product!!
</div>
</div>

 

And the text is still lower than the photo: http://www.cambridgenaturals.com/monthly-buzz/staff-picks/

Share this post


Link to post
Share on other sites
  • 0

Posted · Report post

And you're putting this in a textarea?

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!


Register a new account

Sign in

Already have an account? Sign in here.


Sign In Now
Sign in to follow this  
Followers 0