Jump to content

Archived

This topic is now archived and is closed to further replies.

dyl0310

Align images on page (left, center, right)

Recommended Posts

dyl0310    0
dyl0310

Hello all,

my site : allaboutthebean.com - i'm using pagelines framework. on my homepage, i have a single wide image at the top, and want to add 3 call to actions below it, but they get all out of whack. i'm not sure why. my layout is set up as 1340px. that is the size of the wide image. the 3 images below it are 300px (should be plenty of space for these images)

 

i set the first one left, second one middle, 3rd right. for some reason, the left image is the only one that aligns properly. i have tried every option possible (that i can think of) how do i get these images to line up properly?

 

thanks,

dylan

Share this post


Link to post
Share on other sites
James B    436
James B

Hi Dylan

 

On the site it seems there are three images - DIY/Automatic/Flavor but they are all part of one image. Are these the three images you're referring to? Or are you placing buttons below them? If you're placing buttons below you can insert them using the PageLines Framework Grid system, that will make three columns that you can insert an image into each, using html to align the image into the centre of each column.

 

You can find out more on the grid system here near the bottom of the page - http://demo.pagelines.me/tools/


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites

  • Similar Content

    • BentleyD
      By BentleyD+
      Hey there,
       
      I am working on BentleyRolling.com. I used grams on MoonbodySoul.com and all the images are cropped to a square, whether they are square or 4:5 when posted on instagram, they still get cropped to a square. This looks way better than some being squares and some being 4:5. Did something change since I designed MoonBodySoul.com with Platform5? Can you help me crop all images to a square on BentleyRolling.com 
       
      All the best,
       
      Bentley
    • cstudio
      By cstudio
      How do I control the lightbox effect on the plugin "popthumbs"?  On mobile, it opens up much to small then when expanded it opens to large.  I would like to control the the lightbox to like 90% of the viewer window but I can't figure out how/where to control that.
      Site example

       
      Thx
    • Queue-it
      By Queue-it+
      Hi,
      I am using pl-section-journey and hiding most of the images. When running the page via google speed insights, it tells to optimize all the images that are in this plugins default. (e.g. https://queue-it.com/wp-content/plugins/pl-section-journey/images/drawer-5.jpg ) Like this one that is not visible on the website, but is a part of the plugin and comes up in google insights.
      I've deleted all the images in the plugin, but they still seem to come up. Ref. this page: queue-it.com/features
    • globalnative
      By globalnative+
      Hi there!
      I'm trying to create a featured image for my new blog post. It has text in it, and when I add it as a featured image some of the text is cut off on the right.
      Could I get the ideal dimensions for featured images? Or, a way to customise the dimensions so that they are easier to fit in the way I need?
      Thank you kindly
      Nate
       


    • Houston Haynes
      By Houston Haynes+
      Hey folks - I'm trying to get right of some 'dead space' at the bottom of the page in the Material Theme. (see attached) Those two gray lines have an "Edit" button in between them when the browser has a login cookie for the site. Here I created a screenshot from a browser session that doesn't have context for my main login, so you can see that the "Edit" indicator is gone, but the bars and the space it occupies still remains. Can someone help me isolate this so I can make it *completely* disappear? Thanks.

×