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 5 of 5
  1. #1
    New to the CF scene
    Join Date
    Apr 2014
    Location
    Portland, Oregon
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Image will not center

    I have three images I need to display on a page but for some reason the middle image is not centering properly. Currently it is set as a table, I know this is not optimal and I am looking for a CSS fix for this. I have run down creating a div container but that does not work, I tried <img src=".." style= float:left/center/right.... /> and it still shows as it currently does. The below code is what I originally started with, I know center/align does not work for inline elements so I need a work around.

    Code:
     <h2><a name="sharing"></a>Sharing<div style="float: right;"><a href="#"><img src="../../img/icons/top.png" title="Back to Top" border="0"/></a></div></h2>
        	<p>Last, but not least, is the Share function of DejaTranslate. This allows you to send translated text in Clipboard, Email, SMS, or via any other method available on your device. This allows you to share libraries with coworkers or family members so they do not have to go through translating the same messages again on their devices.</p>
    		<table width="100%" border="10">
    		<tr>    
                <td><img src="../../screenshots/DJTICR_16.png" alt="Sharing 1" style="float:left" width="220" height="391" /></td>
                <td><center><img src="../../screenshots/DJTICR_17.png" alt="Sharing 2" width="220" height="391" /></center></td>
                <td><img src="../../screenshots/DJTICR_18.png" alt="Sharing 3" style="float:right" width="220" height="391" /></td>
            </tr>
            </table>
    Site: DejaOffice Classroom - DejaTranslate
    (Images at bottom of this page, site is a work in progress)

  • #2
    New to the CF scene
    Join Date
    Apr 2014
    Location
    Portland, Oregon
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    No takers, or has this been deemed to dumb a question?

  • #3
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,686
    Thanks
    25
    Thanked 656 Times in 655 Posts
    You should work on patience. It hasn't been up 24 hours yet.
    First you have this at the end of your code:
    Code:
    </body>
    </html>
    </body>
    </html>
    Double your fun, but not good.

    Your images are in two divs 'main classroom content' and 'content_wrapper'.
    content_wrapper is the whole page while main classroom content is the large div to the right where your images ARE centered. But I think you want them centered for the whole width so move the
    Code:
    </div><!-- /main classroom content -->
    up before the table occurs.
    And after that please go to The W3C Markup Validation Service. Your code is out of date.
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."

  • #4
    New to the CF scene
    Join Date
    Apr 2014
    Location
    Portland, Oregon
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Where did you get your snippets from? Also I know this is terribly out of date, this is a work site and the philosophy of "if it's not broke do not fix it" is quite prevalent. The site itself runs off a php that was developed before I got here and they will not let me update it. Is there anything I can do with in this one page I am working on?

  • #5
    Senior Coder
    Join Date
    Jan 2011
    Location
    Missouri
    Posts
    4,686
    Thanks
    25
    Thanked 656 Times in 655 Posts
    I got my snippet from the page you gave in post #1 = DejaOffice Classroom - DejaTranslate
    And that is not generated by PHP, it's a HTML page. Just change that.
    Evolution - The non-random survival of random variants.

    "If you leave hydrogen alone, for long enough, it begins to think about itself."


  •  

    Posting Permissions

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