HTML - Tables Not Lined Up In Ie And Opera

Hi guys,

I recently paid for a Wordpress theme, which I intend to customize extensively, but I've run into an issue that I've never come across before. I'm not a complete newbie but since I've never had this problem before, I don't know where to begin or what might be causing it, and I thought maybe you guys could help me.

When I view my site in the latest version of Opera, every time I move the mouse cursor over the header div, a top margin is created (See screenshot). Does anybody know what might be causing this and how I can fix it? It doesn't happen in Firefox, Chrome or Internet Explorer.

My URL is: http://www.projectdisobey.com

Thanks in advance!

Hi
I've just published a rough version of a portfolio site that I am trying to put together, http://www.kos-mediadesign.com Everything looks exactly as it should in firefox and safari but in explorer some of by divs are sticking to the sides of there browser resulting in the layout being messed up. Also a div that contains a link to the homepage (on the logo) seems to have disappeared. Can anyone help me? I need this site finished asap.

I just started working on creating a website but am having trouble with the navigation on the left hand side. Here is the site:

http://www.infinetwebsolutions.com/

The problem is when you go to the "Contact" page and the "About Us" pages the navigation buttons on the left hand side get moved around and don't stay put. I know the reason that it is getting moved around on those two pages alone are because the text is much longer on those two pages (in the right hand table). That text is in a separate table though, so I don't know why it has any impact to the table structure on the left.

I don't know if I'm providing enough info here to get any help, so please let me know if I need to give more.

Thanks in advance!

Here is some of the code if this helps:

Code:

<tr>
    <th height="55" valign="middle" scope="row"><a href="contact.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image13','','Images/nav_bar/contact_selected.jpg',1)"><img src="Images/nav_bar/contact.jpg" name="Image13" width="137" height="41" border="0" id="Image13" /></a></th>
    <th width="24" valign="middle" scope="row">&nbsp;</th>
  </tr>
  <tr>
    <th height="53" valign="middle" scope="row"><a href="about.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image14','','Images/nav_bar/about_us_selected.jpg',1)"><img src="Images/nav_bar/about_us.jpg" name="Image14" width="137" height="41" border="0" id="Image14" /></a></th>
    <th width="24" valign="middle" scope="row">&nbsp;</th>
  </tr>
  <tr>
    <th height="53" valign="middle" scope="row"><a href="clients.htm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image16','','Images/nav_bar/clients_selected.jpg',1)"><img src="Images/nav_bar/clients.jpg" name="Image16" width="137" height="41" border="0" id="Image16" /></a></th>
    <th width="24" valign="middle" scope="row">&nbsp;</th>
  </tr>

Hey,

Well, I made this webpage, and when I preview in IE its ok, but in opera theres something messed up.

I use table (I know thats bad, but I'v got it to work before), and I use css to script hoover images(buttons) in the menu and stuff. When I preview these in Opera, it shows both the ordinary image, and the hoover image partially overlapping and making the table bigger and messe sup everything.

Any ideas?

Hi,

IE, firefox and safari seem to be able to have a scrollbar even if the page doesnt exceed the screen but opera dont seem to support this. Well, not too sure if is because of the way i script. i simply add in


html{ overflow: scroll} , it work for all but not opera, anyone know why?

Hello
my name is hency
m new to html and css
i just made one website
and its working fine in IE and firefox.
but when i tried in opera and chrome , it didnt work
all margins were messed up.

here is my website add:

http://hencyparmar.byethost8.com/

i hope to get reply soon
u can mail me at hencyp@gmail.com

thanks

Hi! I'm a Opera diehard since I know it's the only browser that does all measures (height/width/etc) 100% correct. And usually when something doesn't show up right in another browser I have different kinds of 'backups' ready, but this time I'm pretty lost.

This is the thing I'm busy with:
test.html
(As you might notice it's pretty much based on the old YouTube menu.)

It really only shows up fine in Opera but just to show you guys what it looks like in the other browsers:
All Browsers - Picture

The codes (test.html):
Quote:
<html>

<head>

<title>TEST</title>

</head>

<body style='background:white'>

<center>

<table border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="177" height="28"></td>
<td width="130" height="28" align="center" valign="middle" background="active.png">
<font color="#333333" size="2" face="sans-serif"><b>Link 1</b></font></td>
<td width="130" height="28" align="center" valign="middle" background="inactive.png">
<a href="link2.html" style="text-decoration: none;">
<font color="#003399" size="2" face="sans-serif"><b>Link 2</b></font>
</a></td>
<td width="130" height="28" align="center" valign="middle" background="inactive.png">
<a href="link3.html" style="text-decoration: none;">
<font color="#003399" size="2" face="sans-serif"><b>Link 3</b></font>
</a></td>
<td width="130" height="28" align="center" valign="middle" background="inactive.png">
<a href="link4.html" style="text-decoration: none;">
<font color="#003399" size="2" face="sans-serif"><b>Link 4</b></font>
</a></td>
<td width="177" height="28"></td>
</tr>

<tr>
<td background="bar.png" colspan="6" width="874" height="37" align="center" valign="middle">

<form id="form" method="post" action="formcorrect.php" enctype="multipart/form-data">
<font color="#333333" size="2" face="sans-serif">URL:</font>
<input type="text" name="url" size="40" value="">
<input type="submit" name="submit" value="Send">
<input type="hidden" name="config" value="0""></form>

</td>
</tr>
</table>

</center>

</body>

</html>
(Also available over here.)

The form isn't active, nor are the pages linked to Link 2-4. The meaning obviously is that the input is centered (align and valign) in all browsers.

The pictures used:
1x active.png: 130 x28px (white on the sides included)
3x inactive.png: 130 x28px
1x bar.png: 874 x37px (colspan=6)
2x 177 x28px (= free space on both sides of top row)
Calculation: 177 + 130 + 130 + 130 + 130 + 177 = 874


Well, I think that's all I can say.
Hope someone could help me out!
Thanks a lot in advance!

The code like: bgcolor="rgb(255,255,0)" is working well in IE but not in Opera.
Is it exsist a method to create a color multibrowserly?
I am writing an application that creates html page with Javascript game and I can't write color like usualy "#FD3800"

hello,
i have a html code with an horizontal flash menu containing 6 flash buttons.

the code is like this

HTML Code:

.....<td width="790" height="30" colspan="2" >
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="131" height="30" >
    <param name="movie" value="2.swf" />
    <param name="quality" value="high" />
    <embed src="2.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="131" height="30"></embed></object>
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="131" height="30"><param name="movie" value="3.swf" />
    <param name="quality" value="high" />
    <embed src="3.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="131" height="30"></embed>
  </object>.....
... the other 4 flash buttons

when i run IE everything is ok but in opera there is an extra space between every 2 flash buttons and i really dont know where that came neighter how to remove them..

thank you, is the first time i enter this forum and it really looks great.my best regards to admins.

hey, im having an issue with Opera... in FF and IE things work fine... but i wanted to see what my customers will be seeing so i downloaded opera to get another point of view... now <body link = "lawngreen"> isnt working vlink works in opera... and oddly opera accepts the vlink = green... and fire fox does not...

I am wondering i dono much about CSS but have been hearing CSS is your friend, Use CSS, edit your CSS, CSS CSS CSS.... whats the deal with the CSS you make a file with specifics ? then reference to it and instead of it using IE / FF / Opera as its reference it looks @ your code now and universally sets figures in all browers?

Or am i way way off here... lol sorry im uber noober here on this 1... can any1 suggest a good CSS info site if they know one, and if any1 knows a fix for the coloring issues between browsers please let me know, thank you all very much...

Could anyone please help me?
I created a login form. And when it is alone on a web page it displays properly in all browsers: IE , Opera and Firefox:
http://www.gpftt.com/a/html/
But when I insert it into a html template it remains good in IE but becomes wrong in Opera and Firefox:
http://www.gpftt.com/a/html/ind.html

I have tried everything I could - html and css editing. I removed all styles from the web page but it still remains wrong. I spent a whole day over it and still couldn't get it working.
Can anybody tell me wtf???

Hi all! I mainly use the above mentioned three browsers to test my page layouts. I just need to know how I can eliminate most of my inconsistency problems, i.e. pages not looking the same in terms of fonts, alignment etc. across multiple browsers.

Is there a way I can check and eliminate these problems quickly? Macromedia Dreamweaver is not an option. I mainly use HTML-Kit to design my sites.

See www.agriads.co.za for an example.

Hello, everybody!
I have a problem.
This page: http://friends21.com/index.php/publi.../name_joecool/
displays properly in Opera and Firefox, but wrong in IE.
I mean in IE for some reason header and footer are aligned left, while in Opera and Firefox it stays centered as it must be.
On this site users are allowed to use html code for their profiles (like for example myspace templates). So this user inserted some code that moves headers to the left. (compare with other users: http://friends21.com/index.php/publi...name_drewness/ http://friends21.com/index.php/publi...administrator/)
But I couldn't find what exactly in that code moves header/footer to the left and why it does so only in IE but not in Opera and Firefox. Anybody knows?
Your help is very much appreciated.
Thank you all in advance.

So we have this old website that we're updating and in our updates we've found that the text will now run over the margins (into our pretty white space). We don't want it to pass the blue tab that says "Contact". Any ideas?

http://www.carlsonbldgservices.com

Also how can I remove the underline in "Click to Enter"?