Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 5906
  • Last Modified:

Putting Pictures next to each other

I am trying to create a banner across the website. While the code below does create the banner size I need,  a single picture comes out too stretched. Therefore I would like to put two or three pictures right next to each other across the same row. However the code that I have puts the pictures one BELOW another. . how can I change that to make them stitched....
<table width="100%" cellpadding="0" cellspacing="0" border="0">
				<tr>
					<td>
					<img src="images/logo1.gif" width="580" height="240">
                    <img src="images/logo2.gif" width="580" height="240">
					</td>
				</tr>
				</table>

Open in new window

0
Starquest321
Asked:
Starquest321
  • 4
  • 4
1 Solution
 
Ryan ChongCommented:
try:
<table width="100%" cellpadding="0" cellspacing="0" border="0">
                                <tr>
                                        <td>
                                        <img src="images/logo1.gif" width="580" height="240"></td>
                    <td><img src="images/logo2.gif" width="580" height="240">
                                        </td>
                                </tr>
                                </table>

Open in new window

0
 
lpxtechCommented:
Try adding style="display: inline;" to the image.

Also, is the table sitting inside of a fixed width tag?
0
 
Starquest321Author Commented:
Can you please tell me the exact "code" to use with the inline command? I have attached the complete code below. Also what is the <!-- tag? The values there are in gray in my dreamweaver and I don't see them on the actual site anywhere...


<tr>
	<td>&nbsp;</td>
	<td colspan="5">
		<table width="975" cellpadding="0" cellspacing="0" border="0" align="center">
		<!--
		<tr>
			<td colspan="3" bgcolor="#E92727" height="6"><img src="images/spacer.gif" border="0" width="1" height="1"></td>
		</tr>
		<tr>
			<td colspan="3" background="images/bg_topblue.gif" height="54">
			
				<table cellpadding="0" cellspacing="0" border="0" class="normal_12_black">
				<tr>
					<td width="500"><img src="images/logo.gif" width="356" height="24"></td>
					<td width="250">
 
						<form action="site_search.php" method="get" style="margin:0px">
						<table cellpadding="2" cellspacing="0" border="0" class="normal_12_black">
						<tr>
							<td valign="middle"><strong>FIND BUSINESS</strong></td>
							<td valign="middle"><input type="text" name="search_keyword" value="" style="width:120px" class="textbox"></td>
							<td valign="middle"><input type="image" src="images/icon_search.gif" vspace="2"></td>
						</tr>
						</table>
						</form>
 
					</td>
					<td width="230" align="right">
						<font class="normal_12_blue_verdana"><strong>Best Business Directory</strong></font><br>
					</td>
					<td width="20"><img src="images/spacer.gif" border="0" width="1" height="1"></td>
				</tr>
				</table>
 
			</td>
		</tr>
		-->
		<tr>
			<td colspan="3" bgcolor="#FFFFFF" height="3"><img src="images/spacer.gif" border="0" width="1" height="1"></td>
		</tr>
		<tr>
			<td colspan="3">
 
				<table width="100%" cellpadding="0" cellspacing="0" border="0">
				<tr>
					<td>
					<img src="images/logo1.gif" width="980" height="160">
                    				</td>
				</tr>
				</table>
 
			</td>
		</tr>
		<tr>
			<td colspan="5" bgcolor="#FFFFFF" height="3"><img src="images/spacer.gif" border="0" width="1" height="1"></td>
		</tr>
		<tr>
			<td colspan="3">
				
				<table width="100%" cellspacing="0" cellpadding="0">
				<tr>
					<td width="1%" align="left"><img src="images/nav_left.gif" width="20" height="37"></td>
					<td width="100%" background="images/nav_bg_blue.gif">
 
						<table cellspacing="0" cellpadding="0" class="normal_12_white_verdana">
						<tr>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							<td width="100" align="center" class="{$nav_class_home}" onclick="location.href='index.php'">
								<a href="index.php" class="normal_12_white_verdana"><strong>Home</strong></a>
							</td>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							<td width="100" align="center" class="{$nav_class_about}" onclick="location.href='site_about.php'">
								<a href="site_page_about.php" class="normal_12_white_verdana"><strong>About Us</strong></a>
							</td>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							<td width="100" align="center" class="{$nav_class_resources}" onclick="location.href='site_resources.php'">
								<a href="site_resources.php" class="normal_12_white_verdana"><strong>Resources</strong></a>
							</td>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							<td width="150" align="center" class="{$nav_class_account}" onclick="location.href='member_login.php'">
								<a href="member_login.php" class="normal_12_white_verdana"><strong>My Account</strong></a>
							</td>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							<td width="100" align="center" class="{$nav_class_register}" onclick="location.href='member_register.php'">
								<a href="member_register.php" class="normal_12_white_verdana"><strong>Register</strong></a>
							</td>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							<td width="100" align="center" class="{$nav_class_contact}" onclick="location.href='site_contact.php'">
								<a href="site_page_contact.php" class="normal_12_white_verdana"><strong>Contact Us</strong></a>
							</td>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							<td width="150" align="center" class="{$nav_class_terms}" onclick="location.href='site_terms.php'">
								<a href="site_page_terms.php" class="normal_12_white_verdana"><strong>Terms of Use</strong></a>
							</td>
 
							<td><img src="images/nav_divider.gif" width="2" height="37"></td>
							
						</tr>
						</table>
 
					</td>
					<td width="1%" align="right"><img src="images/nav_right.gif" width="20" height="37"></td>
				</tr>
				</table>
				
			</td>
		</tr>
		<tr>
			<td colspan="2" bgcolor="#FFFFFF" height="3"><img src="images/spacer.gif" border="0" width="1" height="1"></td>
		</tr>
		<tr>
			<td width="1%" valign="top"><img src="images/search_left.gif" width="12" height="48"></td>
			<td width="100%" height="60" background="images/search_hor.gif" style="background-repeat:repeat-x;">
			
				{if $clogin_member != ""}
				<table width="100%" cellpadding="0" cellspacing="0" border="0" class="normal_12_black">
				<tr>
					<td>
 
						<table cellpadding="2" cellspacing="0" border="0" class="normal_12_black">
						<tr>
							<td valign="middle"><strong>MY ACCOUNT : </strong></td>
							<td valign="middle"><a href="member_profile.php" class="normal_12_red">My Profile</a></td>
							<td valign="middle"> | </td>
							{if $clogin_member_type == "agent"}
							<td valign="middle"><a href="member_subscription.php" class="normal_12_red">My Subscription</a></td>
							<td valign="middle"> | </td>
							{/if}
							<td valign="middle"><a href="member_listing.php" class="normal_12_red">My Property Listings</a></td>
							<td valign="middle"> | </td>
							<td valign="middle"><a href="member_favourite.php" class="normal_12_red">My Favourite Listings</a></td>
							<td valign="middle"> | </td>
							<td valign="middle"><a href="system_member_logout.php" class="normal_12_red">Logout</a></td>
						</tr>
						</table>
					
					</td>
					<td align="right" class="normal_12_blue_verdana"><strong>Welcome, <u>{$clogin_member_firstname} {$clogin_member_lastname}</u>!</strong></td>
				</tr>
				</table>
				{else}
				<img src="images/spacer.gif" border="0" width="956" height="1">
				{/if}
 
			</td>
			<td width="1%" valign="top"><img src="images/search_right.gif" width="12" height="48"></td>
		</tr>
		</table>
	</td>
	<td>&nbsp;</td>
</tr>

Open in new window

0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
lpxtechCommented:
<!-- opens a comment and --> closes it. Anything within the comments are ignored and wont be displayed.
<table width="100%" cellpadding="0" cellspacing="0" border="0">
                                <tr>
                                        <td>
                                        <img src="images/logo1.gif" width="580" height="240" style="display: inline;"><img src="images/logo2.gif" width="580" height="240" style="display: inline;">
                                                </td>
                                </tr>
                                </table>

Open in new window

0
 
Starquest321Author Commented:
Thanks for you help. Can you also look to see if you see anything with my post:

http://www.experts-exchange.com/Web_Development/Web_Languages-Standards/PHP/Q_23884495.html

Much appreciated.
0
 
Starquest321Author Commented:
It worked with the pictures but it put the whole site to display vertically. It seems that it put all the tables on top of one another.
0
 
lpxtechCommented:
No problem,

Glad I could help. I will take a look at your other post soon.
0
 
lpxtechCommented:
After looking at your code again. I know what the problem is. Your table width is set to 975 and 580+580 is 1160 which is much wider than your table.

To fix the problem, take the style="display: inline" out that I told you to put in, and either use 2 images that are equal to or less than 975 or change the width of the table to be equal to or larger than 1160.
0
 
Starquest321Author Commented:
Excellent! Thanks so much!
0

Featured Post

Upgrade your Question Security!

Your question, your audience. Choose who sees your identity—and your question—with question security.

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now