• JustBlog

    (@justblog)


    Hi, I know this seems like quite an easy task but I couldn’t make it. Hope somebody can help.

    I would like to put 2 images with caption side by side

    Tried the following:

    1. Float:left for the first image; both images.
    2. alignnone and alignleft for both.

    But still get no result.

    Thanks!

Viewing 15 replies - 1 through 15 (of 25 total)
  • Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Can you provide a link to the issue?

    Thread Starter JustBlog

    (@justblog)

    It’s in my draft now as I haven’t get it done yet so I didn’t upload it yet.

    Here’s basically my code:

    [caption id="attachment_5402" float="left" width="200"]<img class=”wp-image-5402 ” title=”title” alt=”test” src=”….mysource.jpg” width=”200″ height=”297″ /> test caption[/caption]

    [caption id="attachment_5444" width="225"]<img class=”size-full wp-image-5444 ” alt=”abc” src=”…my.jpg” width=”225″ height=”297″ />caption[/caption]
    <p style=”text-align: justify;”>

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Can you post the HTML?

    Thread Starter JustBlog

    (@justblog)

    That’s the html…

    Right after that will be my content.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    We can’t work from shortcodes here.

    Thread Starter JustBlog

    (@justblog)

    Take a look if this helps?

    [caption id="attachment_5402" align="alignnone" width="168"]<img class=”wp-image-5402 ” title=”Raymond Looi and Family” alt=”Raymond Looi and Family” src=”https://www.singpetra.com/wp-content/uploads/2013/02/Raymond-and-Family.jpg&#8221; width=”168″ height=”250″ /> Raymond Looi and Family[/caption]

    [caption id="attachment_5444" align="alignnone" width="189"]<img class=”size-full wp-image-5444 ” alt=”Jaemon Looi – Before & After 1st Surgery” src=”https://www.singpetra.com/wp-content/uploads/2013/02/Jaemon-copy.jpg&#8221; width=”189″ height=”250″ /> Jaemon Looi – Before & After 1st Surgery[/caption]

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Can you make a JSfiddle page with the HTML and CSS for one relevant webpage?

    Thread Starter JustBlog

    (@justblog)

    I think you mean this;

    https://jsfiddle.net/x2qxw/

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Are you using Windows?

    Thread Starter JustBlog

    (@justblog)

    I’m using Mac. Does this related to the coding?

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Can you view your webpage and use the mac’s equivalent of right click bring up an option named, ‘View source’? Then select that View source option and in the new pop-up window, take all of the contents of that pop-up window and paste it into the HTML section of jsFiddle.

    Can you also copy all of the code from your style.css file and paste it into the CSS section of jsFiddle?

    Thread Starter JustBlog

    (@justblog)

    Ok… i published it.. Hope that you may help to fix this:

    https://www.singpetra.com/2013/01/30/new-year-thanksgiving-2013/

    Thanks!

    Thread Starter JustBlog

    (@justblog)

    Please refresh for the content as I didn’t update the caption correctly just now.

    Andrew Nevins

    (@anevins)

    WCLDN 2018 Contributor | Volunteer support

    Did you resolve the issue?
    They look side-by-side to me [screenshot].

    Nevermind, just refreshed.

    Thread Starter JustBlog

    (@justblog)

    This is up and down.

    I would like it to be one on left and one on right.

Viewing 15 replies - 1 through 15 (of 25 total)
  • The topic ‘Image with Caption – Side by Side’ is closed to new replies.