HTML - Aligned Left In Firefox, Centered In Ie?!?

I have the exact same table at the very bottom of this page that is centered in both IE and Firefox...

http://www.massagelaunch.com/

but on this page I have the exact same table that IS NOT CENTERED in Firefox...any idea why?
http://www.massagelaunch.com/affiliates.html

Thanks in advance!

Hi,

can anybody tell me why the flash animation is not correctly displayed in Firefox ? (and only the second time I visit the website)

http://lancelmaat.nl/

thanks

I would like to know if there is such a thing as a tag within a table, that can collapse if the next table within that prior one gets too big to center?

Here is an example of a part of my code:

Code:

      <table style="width:757; border-style:solid; border-width:thin; margin:0 0 15px 0">
       <tr><td class="spb-category" width="750" style="text-align:left;" colspan="3">Title of this category</td></tr>       
       <tr>
        <td valign="top" width="33%">
         <table width="100%" border="0" cellpadding="0" cellspacing="0">
          <tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=103">large size book title with author</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
          <tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=187">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
          <tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=197">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
         </table>        </td>
        <td valign="top" width="33%">
         <table width="100%" border="0" cellpadding="0" cellspacing="0">
          <tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=101">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
          <tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=188">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
          <tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=120">Medium sized boot title</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
         </table>        </td>
        <td valign="top" width="33%">
         <table width="100%" border="0" cellpadding="0" cellspacing="0">
          <tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=102">a very long title of a book which includes the author</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
         </table>
        </td>
       </tr>
      </table>

1. I want to center each column so that the first letter of each book title is lined-up, but that the longest title on each column has equal space on both left and right.

2. If you look at each column, the width is about 245px. With regard to the first book title in the first column, I have 50px that is extra, therefore I'd like to automatically add 25px to the front of each one of the books for that column.

3. On the second column, there is about 80px extra, therefore I'd like to auto-add 40px to the front of each book in that column.

My problem is that I don't want the column centered individually because then I will lose the straight line that I'd like each book to be on top of each other as it starts the line.

I tried:
style="margin-left:20px"
and
style="padding-left:20px"
but when the title got too long it would not auto-collapse the left side, I want it to collapse!

I want one tag that I can insert evenly on every section to get the push to the right an even amount of spaces for every book on each column.

If it comes down to it, I wouldn't mind sacrificing that each column gets auto aligned to what is necessary for its own column. So if I have to use one number, say 30px, for the whole webpage, then ok, I'd do it.

My problem is that sometimes the 30px empty filler space for the left, in order to push the title to the right, is not enough space for a very long title and it winds up sending half the title to the next line, which I don't want.

This code is a list of books that spans about 20 categories and about 400 book titles.

Thanks in advance for any help you might offer.

Hi all.
I've been trying to accomplish a simple task with less to no luck, I hope somebody here can help...

I'm trying to create a single page with a solid color background, with a square image (let's say 500px * 500px) centered in the page and above the solid color, with some text centered above the image. All of this should work even resizing the window: I mean, the image should resize mantainig its proportions.

Is there any way to do this? I tried both tables and css, but had no luck...


Thank you in advance.
Melmoth

For some strange reason if I want to have an ad or image on the left of my text article usually i put a div code around whatever it is like..

Code:

<div style="DISPLAY: block; FLOAT: left; MARGIN: 0px 10px 0px 0px">

</div>

This works GREAT in firefox but then i was shocked when i went over to Internet explorer and tested my site there using the latest browser.. it doesnt acknowledge that code and so the ad or the image ends up being above my article instead of nicely on the left and the text wrapped around it on the right like you see in firefox

Any ideas how to get around this? Maybe a fix that works for ie. and firefox?

thank you guys and gals in advance

I have a BUTTON element in which I am placing and image. It looks fine in IE, but firefox is adding some extra left padding to it. Setting margin and padding to the img does not help. Anyone know of a workaround?

See the page at http://newsite.mortgageisrael.com/sh....asp?pageid=18 (2 places)

HTML:
Code:

<button type="submit" class="formButton" style="width:77px"><img src="images/submit.gif" alt="Submit"/></button>

CSS:
Code:

.formButton{
	font-weight:		bold;
	margin-top:			10px;
	cursor:				pointer;
	height:25px;
	border:1px solid black;
	padding: 0px;
	text-align:center;
}

.formButton IMG{
	padding: 0px;
	margin: 0px;
}

Thanks

Hi there,

Using fireFox I get the desired result, but when using IE I get the image on the *left* side?!

this is my code (the header is a jsp page that has an image and user's info name and last logged in))


<td width="90%" valign="top" align="right">
<tiles:insert attribute='header'/>
</td>


as you can see the image (header) is align to the right, but IE pushes it to the left (I wrote center - and it still keeps on pushing it to the left) any idea why??

the text on My Browse button shows half only. How do you fix it?
attached please find pic

Hi all,

I'm currently working on a website for our office, but absolutely not an expert. Usually, I can find plenty information on the internet to fix more or less what I like to make. This time, however, I'm clueless...

The bottom 1/4 of the screen will be a menu bar with images. (small, approx 120x63px). I want these images scattered across the bar. They will be image links to our current projects. By varying in size and place (chronologically from left to right), the importance will be visualized. Thus, the images won't be placed in a grid.

I hope I made myself clear and you guys understand what I'm looking for. I've tried working with the AP-elements in Dreamweaver, thus far, unsuccessful. (I'm not even sure if this should be here or in the CCS forum...my apologies)

Your advise would be appreciated!

Hi..

is there any possibility to do something like on that screen pictu
http://www.speedyshare.com/387574283.html

i mean a page layout with two frames, both aligned to the center of the page ?


plz help :/
thx in advance

Well, I am new to HTML and I would just like to say that I appreciate anyone who takes their time to busy themselves with my concerns. I have a simple problem that I am not sure how to fix. My problem is that in all the tables I create, the first row of the table (the titles) are all centered, but pushed a bit to the left. I use the the text align center and <center> tags and it works on everything except the table titles, which are centered, but a bit to the left. It is fairly noticeable and is extremely annoying. Can someone try helping me out? Thanks.

-fenzo666

I have no idea why, but the pictures in the table at https://www.wagnermeters.com/california1.php are aligned vertically instead of horizontally as it seems they should be. Am I going crazy? What can I do about it?

Hi all, brand new here. I'm working on a simple website for a project I'm doing with a friend, but I'm having a problem with the layout. The site is www.Project217.com. On my Macbook, the content on all of the pages appears centered, which is where I want it. Firefox, Safari and IE all display properly. However, on my Windows computer at work all of the content within the black section of the pages is aligned to the left.

Is there an issue with my source code that I'm missing?
Thanks for any help,
Aaron