Jump to content

pages align differently based on image size


jlodwick

Recommended Posts

I have 2 pages that are copies of each other with the exception of one of them has a smaller image on the page and it moves the whole page over a couple centimeters.  I have been working on this for a long time and I can't figure out why the size of the picture causes the whole page to shift.  The 2 pages are below.  By the way they are both using the same css sheets too.

 

http://www.babyboomermd.com/development/about-us.html

 

and

 

http://www.babyboomermd.com/development/about-us1.html

 

Link to comment
Share on other sites

It shifts because a table cell tries to use only the minimum space necessary.  With a smaller image it is using less space.  That extra space gets allocated to the other cell instead.

 

If you want to cells to be a consistent size then you have to set their width using either CSS or the width attribute.  You are also missing your <tr></tr> tags around your cells.

 

<table>	
<tr>
	<td class="faceCompareCell">
		<img  src="design/facerejuv1.jpg" alt="Massage">
	</td>
	<td>
		Did you know that 10,000 baby boomers are retiring every day in the US?
		<br>
		<br>
		If "GROOVY" and (image of a piece symbol) meant something to you in the 60's than BHRT, BOTOX&reg, LASERS, WEIGHT MANAGEMENT AND WELLNESS should mean something to you <b>NOW</b>.
		<ul>
			<li>Optimize your hormones</li>
			<li>Look much younger</li>
			<li>Feel healthy and terrific</li>
			<li>Possess awesome energy</li>
		</ul>
	</td>
</tr>
</table>

 

Then add to your css

.faceCompareCell{
   width: 50%;
}

 

Link to comment
Share on other sites

This thread is more than a year old. Please don't revive it unless you have something important to add.

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Restore formatting

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.