Images side by side

  • Author
    Posts
  • #131957

    I am trying to put two images (one left and one right) on a page. And hyperlink each one of them. Is there a way to put them next to each other rather than stacked on top of each other?

    The blog I need help with is walshscience.com.

    #131973

    tarasdashkevych
    Theme Author

    Hello,

    It’s possible to accomplish with a custom HTML: https://pastebin.com/aLzn3yFv

    When you go to the Write page, at the top of the Write box are two tabs: one says Visual and one says HTML. If you click on the HTML one you’ll get taken to the HTML editor, which is where you can insert HTML code you want in a post.

    https://en.support.wordpress.com/editors/#html-editor

    Please let me know if you have any other questions.

    Thank you,
    Taras

    #132032

    This is great. I assume you can edit the size of the images with some HTML magic too.

    Thank you!!!

    #132033

    So I sized the images down successfully but now they are really spaced out. Any idea on how to tell HTML to put them side by side (with a little space in-between) on the left hand side of the page?

    https://walshscience530171339.wordpress.com/wp-admin/customize.php?url=https%3A%2F%2Fwalshscience530171339.wordpress.com%2F

    #132067

    tarasdashkevych
    Theme Author

    “So I sized the images down successfully but now they are really spaced out. Any idea on how to tell HTML to put them side by side (with a little space in-between) on the left hand side of the page?”
    – Could you please make your site public and send me a link to the page where this custom CSS is added?

    Unfortunately, I cannot access your site using the admin link that you’ve posted above.

    Thanks,
    Taras

    #132451

    Hi Taras,

    I am about to start this editing now. Sorry it took me so long to reply.

    Can I alter the below code for three images in a row, or will it only work for two?

    </div>

    #132452

    Apologies, here is the code I was talking about

    
    
    
    
    
    
    
    </div>
    #132453

    I’m not sure how to paste code in here and it not show up as the images, I am just trying to show the HTML!

    I am talking about the code you provided me in this link.

    https://pastebin.com/aLzn3yFv

    #132458

    tarasdashkevych
    Theme Author

    “I’m not sure how to paste code in here and it not show up as the images, I am just trying to show the HTML!”
    – Currently, it’s not possible to show the HTML in this forum. It should be fixed soon.

    “Can I alter the below code for three images in a row, or will it only work for two?”
    – Sure. Please use this custom HTML to display three columns: https://pastebin.com/U0DNB8Tm

    Hope this helps.

    Thanks,
    Taras

    #132736

    Hi Taras,

    Last question before I close the thread. For Bootstrap HTML, is it possible to tell html/css to make all cells equal (in height and width) and put spacing between each row? I am doing the three columns three times in a row, and would like some spacing between the rows.

    Thank you!

    #132756

    I figured out the answer to the above. I am currently trying to figure out how to implement a drop shadow to the images I added.. any CSS advice would be greatly appreciated!

    #132793

    tarasdashkevych
    Theme Author

    “I am currently trying to figure out how to implement a drop shadow to the images I added.. any CSS advice would be greatly appreciated!”
    – Could you please post a link to the page where you’ve added these images?

    Thank you,
    Taras

    #132828
    #132877

    tarasdashkevych
    Theme Author

    Thank you for the link! Please use this custom CSS to add a drop shadow to the images:

    
    .page-id-861 .entry-content .row img {
          box-shadow: 0 0 20px #000000;
    }
    

    Where 861 is the ID of the page.

    Hope this helps.

    Best,
    Taras

    #132892

    Thank you so much! That looks so much better! I was trying to do it myself but was failing.

    Cheers,

    #132900

    tarasdashkevych
    Theme Author

    Not a problem! Glad I could help :)

The topic ‘Images side by side’ is closed to new replies.