Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Basic image alignment inquiry

    Excuse the trivial nature of my question, I am very inexperienced with coding. On my website I would like to exhibit a menu directory featuring an aligned series of images to the left of the country's name from where the photographs were taken. I am nearly there, however I am having difficulty aligning the images together while having the images still remain in the center of the page. Here is a screen shot of my issue, complete with my juvenile attempt at code to the left. Please suggest a way for me to simply align these small images to allow for a more semetrical and visually appealing layout, where at current these images bracket like a staircase.

    Last edited by nb1989; 07-07-2011 at 08:30 PM.

  • #2
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,350
    Thanks
    11
    Thanked 589 Times in 570 Posts
    center a common container for the images and text, specify a width for the image and the container...
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/5/28) IE7:0.1, IE8:5.3, IE11:8.4, IE9:3.2, IE10:3.2, FF:18.2, CH:46, SF:7.9, NON-MOUSE:32%

  • #3
    New to the CF scene
    Join Date
    Jul 2011
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    rnd me's right. I would probably use a table.
    Code:
    <table style="border:0px; margin: auto;">
    <tr>
    <td width="##"><img src="myanmar.jpg"></td>
    <td><a href="...">Myanmar</a></td>
    </tr>
    <tr>
    <td width="##"><img src="myanmar.jpg"></td>
    <td><a href="...">Myanmar</a></td>
    </tr>
    <tr>
    <td width="##"><img src="myanmar.jpg"></td>
    <td><a href="...">Myanmar</a></td>
    </tr>
    <tr>
    <td width="##"><img src="myanmar.jpg"></td>
    <td><a href="...">Myanmar</a></td>
    </tr>
    </table>
    Something like that (Changing the width, urls, and changing the repeats to the other three). I'm doing it mainly from the top of my head (I had to give you the updated centering style--I shouldn't, but I generally use align center).

    I don't know if it's the best way, but it should work.
    Last edited by dite; 07-07-2011 at 10:45 PM.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •