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 6 of 6
  1. #1
    Regular Coder
    Join Date
    Apr 2011
    Posts
    107
    Thanks
    18
    Thanked 0 Times in 0 Posts

    How to place images side by side

    im trying to place images side by side but instead one image is pushing the other image down and wont allow it to be placed beside each other.

    any help will be appreciated.

  • #2
    Senior Coder angst's Avatar
    Join Date
    Apr 2004
    Location
    Toronto, Ontario
    Posts
    2,114
    Thanks
    15
    Thanked 122 Times in 122 Posts
    try:

    PHP Code:
    <img src='SomeImage.jpg' align='left' /> 

  • Users who have thanked angst for this post:

    shakoor6 (05-06-2011)

  • #3
    Regular Coder
    Join Date
    Apr 2011
    Posts
    107
    Thanks
    18
    Thanked 0 Times in 0 Posts
    Iv tried that..still doesnt seem to move left...This is my code.

    HTML
    Code:
    <div id="Newsbar">
    			<img src="Homepage/NewsBar.png" width="546" height="50" alt="News Bar"/>
    			 
    		<img class="nani" src="Homepage/Nani.jpg" align="left" width="85" height="54"/>
    			
    		<img class="bpoints" src="Homepage/News.png" align="center" width="60" height="261"/>
    			
    		<img class="gossip" src="Homepage/Gossip.png" width="295" height="320"/>
    	</div>
    The two images im trying to position are 'nani' & 'bpoints'

    CSS
    Code:
    
    img.nani{
    padding-top: 0px;
    padding-left: 200px;
    }
    
    img.bpoints{
    padding-top: 0px;
    padding-right: 0px;
    }

  • #4
    Regular Coder
    Join Date
    Apr 2011
    Posts
    107
    Thanks
    18
    Thanked 0 Times in 0 Posts
    that actualy kind of works....my image when i used align left doesnt align fully to the left? why would this be.

  • #5
    Senior Coder angst's Avatar
    Join Date
    Apr 2004
    Location
    Toronto, Ontario
    Posts
    2,114
    Thanks
    15
    Thanked 122 Times in 122 Posts
    ah, try adding css

    PHP Code:
    img{
    floatleft;
    padding0;


  • Users who have thanked angst for this post:

    shakoor6 (05-06-2011)

  • #6
    New to the CF scene
    Join Date
    May 2011
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    The only reason I can see why this would place them below one another is because there is not enough space to fit them side by side ie. Say you have 100px width of space and you are trying to fit two images that are 60px each wide, it will place them on top of each other because they are too wide.

    Simply putting <img src="URL"><img src="URL"> should put them side by side with no space in between if there is enough space horizontally.

    Hope this helps.


  •  

    Posting Permissions

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