HTML - With Ie7 Site Looked Fine, But With Ie8 Its A Crime

Help. I made this page for a client but he tells me it is misaligned when he browses the page on his mac(both firefox and safari)

http://www.freewebs.com/fernandosdesign/detox.html

It looks perfectly fine on a pc (firefox and ie) any idea whats happening and how I can correct this issue?

Thanks guys

http://www.freewebs.com/fernandosdesign/detox.html

See http://www.smoli.com

I just added the SmoothDivScroll (jQuery add-on) to my page to create scrolling images at the bottom.

Unfortunately as a result the table no longer resized correctly to the size of the screen, and the scrolling does not work. This only happens in Firefox, in IE8 everything works as it should.

Any idea what is wrong with my code?

Many thanks in advance,

J.

PS: Everything also works fine when previewed from within FrontPage 2k3 (the editor I use to create the page).

I have recently seen the IE "Error on page" status popping up on my website http://www.bluchip.gg/home.

The errors a

Line: 322
Char: 7
Error: Expected ':'
Code: 0

Line: 45
Char: 8
Error: Exception thrown and not caught
Code: 0

Line: 206
Char: 37
Error: Unterminated string constant
Code: 0

I'm using Dreamweaver CS3 and I've validated the page and everything is fine. I've looked through the code to find the places specified but all looks fine to me (probably looking in the wrong place! ). These errors come up on all my pages (I'm using a template so I think the errors are in that).

Any ideas what is wrong?

I'm making a website on my mac and when I view it it looks fine, but when I view it on my windows px on 1080x720 res it has everything moved to the right some and even the sizes are wrong. But when I change my res to 1280 x 1080 it looks how it does on my mac (which is 1280 x 800 res).

I'm guessing the resolutions are effecting the site's margins and size attributes.

Is there a way to fix this?

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>

Hello folks.

I have been trying out this site as a beta for a hockey team. I am developing a site and have an issue with ONE page in particular. Every other page looks great!

http://web.mac.com/chris.ducasse/force_beta/staff.html
That is the culprit. I have looked over the source code, and cannot find anything that would cause it. What happens, if you don't see it, is that the page does not take the entire site width, it wraps the text at about 2 inches or so away from the right edge of the page.

Any help is appreciated.

Also, I got the navigation bar (modified it myself) from Open Source Web Design and want to give the artist credit - where do I do that in HTML code?

Thanks again.

So my site that i am developing has hit a bit of a snag.

In firefox it looks great, however when i switch over to IE i get a big white space. I am wondering if anyone knows how i can correct this white space?

http://www.wdwcanada.com/maps.php is the link.

Thanks,

Hi guys,

I'd really appreciate if someone could please take a look at this site and tell me why I'm getting the alignment issues with some of my divs in internet explorer. Everything looks good in firefox, except that also when the text stretches off the page, the whole site moves to the right a little bit, which I'd like to fix as well. I also just added some span tags but the w3c validator is telling me there's something wrong with it. Could someone suss that one out for me too please?

thank you

http://www.travellersclinic.com.au/index.html

Hello everyone! Thank you for taking the time to read this. Could anyone please look at my site in IE or FF and tell me how to remove the gap between the table row that has the links at the top and the row that starts the content? The address is http://www.hard2kill.org.

I figure it would be less cluttered by leaving the code off of this post and just accessing the page source from the site; however, if you would like me to post it here, I certainly can! When I view it in Chrome, it looks just fine. IE and FF show the gap.

Yes, I know using tables this way is bad designing, but I am continually learning more and trying to transition from them, so please leave personal opinions to yourself. If a fix can be made, then I would appreciate your input! I have all the cellspacing, cellpadding, and borders set to 0 so I am at a loss. Thanks in advance!

I am building a web site for one of my friends. The address is www.lawlessbullies.com . I can't get the middle section to remain centered on both Firefox and IE. It looks perfect in IE, but not in Firefox. I'm not sure if I need to edit my html, or the css. Can someone take a look and help me out? i've been trying to find a solution for weeks and this is my last resort. Its probably something small, and easy. I'll post my index.html and my style.css

I got this little problem, if you view the below page on IE it shows fine, but on FF it shows a space after the flash.

http://www.test.muslimways.com

Any advice?

Hi,

Thanks in advance for your help. I'm doing a web page that I would like to be viewed on 1024 resolutions without a horizontal scrollbar. It will contain images that are exactly 980px wide. The problem is that with ie7, as soon as it contains a div or a table, no matter what I do to try to remove all padding,margins,etc.. it adds 2px for each element (I guess 1px for each side). Below is some html as an example of my problem, where I've tried to remove everything I can think of... this works fine in firefox 3

<body style="width:998px;margin-top:0;margin-left:0;margin-right:0;padding:0;">

<div style="width:100%;textalign:center"><table border="0" cellspacing="0" cellpadding="0" style="width:998px;border-collapse:collapse;padding:0;margin:0;border:0;"><tr style="padding:0;margin:0;border:0;"><td style="padding:0;margin:0;border:0;">sdfsdfd</tr></td></table><div style="width:100%>
</body>

Hi
the page in question is this one
Removed, as I dont think advertising is allowed?, so i removed the link
For me it renders perfectly in Firefox 3
However i noticed that in IE7, dont know about IE6 it sticks the whole page on the left, as if there were no formatting or .css file, this cant be true because Firefox renders it fine and the text is all in relation ot the .css file
So please can someone help me with this, it is in PHP, but only a line really
Chris

I have a website hosted at discoverybyte.uuuq.com, and it is working great, except that the heading is displayed weird in IE8. It works fine on Firefox 3.5 though.

In IE8 the heading menu is indented when I prefer it not to be.

See the attached images for more help.

Please note that as of this posting the code is on my website shown above.

Any help would be appreciated.

Hi

I have tried a lot of things and search the internet for hours regarding this matter... My image background doesn't reapeat in Internet explorer however works fine in any other browsers such as google chrome and firefox. Can you please help me get this fixed? I am new to xhtml and css and really it's really frustrating having this kind of problem.


Thank you

Website Link: www.pjrazon.co.uk/newlayout/index.html

screenshots if it helps:





CSS:
@charset "utf-8";
* {
margin: 0px;
padding: 0px;
}
body {
background-color: #CCCCCC;
}

a:link { color: #ffffff;
text-decoration: none;
}
a:visited {text-decoration: none;}
a:hover {color: #b23937;}
a:active {text-decoration: none;}

#wrapper {
width: 1151px;
margin-right: auto;
margin-left: auto;
border-right-width: thin;
border-left-width: thin;
border-right-style: solid;
border-left-style: solid;
border-right-color: #999999;
border-left-color: #999999;
}
#wrapper #logo {
height: 120px;
width: 1151px;
}
#wrapper #navigation {
background-image: url(../images/nav.home.gif);
height: 32px;
}
#wrapper #navigation #navlabel {
color: #FFFFFF;
padding-top: 5px;
padding-left: 125px;
}
#wrapper #navigation #navlabel #nav li {
display:block;
width:100px;
float:left;
list-style:none;
}
#wrapper #header {
height: 391px;
background-image: url(../images/welcome.jpg);
}
#wrapper #mainContent {
height: 384px;
background-image: url(../images/maincontent.jpg);
width: 1151px;

}
#wrapper #bodyArea #footer {
background-image: url(../images/footer.jpg);
height: 73px;
clear: both;
}
#wrapper #bodyArea {
background: url(../images/bg_bodyarea.jpg) repeat-y;

}
#wrapper #bodyArea #mainContent #content {
display:block;
width:400px;
float:left;
}
#wrapper #bodyArea #mainContent #contentwrapper {
padding-left: 140px;
padding-top: 70px;
}

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Perfect Vision</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="wrapper">
<div id="logo"><img src="images/header.jpg" alt="logo" /></div>
<div id="navigation">
<div id="navlabel">
<ul id="nav">
<li><a href="homepage.html">Home</a></li>
<li><a href="profile.html">Profile</a></li>
<li><a href="portfolio.html">Portfolio</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</div>
</div>

<div id="header"></div>

<div id="bodyArea">
<div id="mainContent">
<div id="contentwrapper">
<div id="content">
<p>August 10 2010</p>
<p>&nbsp;</p>
<p> Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam semper turpis in tortor interdum sed mattis lectus mollis. Pellentesque laoreet quam et mauris feugiat sit amet eleifend turpis imperdiet. Praesent condimentum libero vitae massa imperdiet pellentesque. Vestibulum et risus dolor, ac tincidunt velit. Maecenas lobortis diam tellus. Suspendisse auctor, velit ut imperdiet semper, erat orci pharetra tortor, venenatis vulputate metus eros ut felis. Cras ullamcorper odio sed felis ornare ultricies. Phasellus porta adipiscing aliquet. Aenean ligula tellus, blandit a pulvinar in, fermentum a erat. Sed arcu nisl, porta eu vestibulum at, luctus sed tellus. Aenean eget quam justo, quis ultricies ante. Vivamus tempor sollicitudin augue ut rhoncus. Sed odio mauris, imperdiet ut elementum vitae, dapibus at quam. Nullam in aliquam sem. Fusce consectetur laoreet elit, non consequat nunc tempus nec. Cras at enim ipsum. Praesent ipsum purus, tempus non sagittis volutpat, fringilla eget mi. Maecenas sed elit est. Morbi facilisis purus eget nunc tincidunt iaculis mattis quam pellentesque. </p>
<p> Sed tortor leo, laoreet sit amet mattis a, fermentum in ligula. Sed tempor lacus a lorem fermentum fermentum semper nunc sagittis. Vivamus et est porta purus mollis cursus eget in ante. Sed lacinia, diam in tempor suscipit, turpis enim posuere turpis, sit amet vestibulum quam nulla id elit. Vivamus ultricies tempus mi, non consequat velit mollis id. Curabitur vehicula, turpis id tempor condimentum, sem nulla molestie enim, vel commodo metus ipsum non nisi. Aliquam erat volutpat. Fusce venenatis porttitor massa eget suscipit. Sed purus turpis, iaculis id sollicitudin id, vulputate sit amet velit. Suspendisse sed velit non tellus eleifend venenatis vehicula ut elit. Integer sit amet ullamcorper nulla. </p>
<p> Vestibulum dictum ante eu nisl ornare tincidunt. Etiam id risus mauris. Duis nec turpis in neque porttitor euismod sed id odio. Sed molestie urna a magna fermentum egestas. Nulla facilisi. Quisque risus neque, sodales pulvinar rhoncus a, lacinia eget neque. Vivamus vel malesuada nisl. Proin mollis tempor felis id dapibus. Morbi velit mi, aliquet sed malesuada et, blandit vitae eros. Nulla nec lorem quam, eu aliquam sapien. Quisque venenatis, enim non ultricies lobortis, lectus dolor consectetur nulla, eu tincidunt metus enim vitae libero. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Praesent sit amet neque eu libero commodo condimentum. Fusce hendrerit diam sed libero lacinia nec adipiscing massa posuere. Pellentesque eget libero risus, eget venenatis metus. Morbi quis dolor enim. Cras orci orci, ultrices nec consectetur sed, auctor non leo. Aliquam nec sem erat. Nam ut nunc sed leo tempor pretium. Maecenas sit amet tortor a neque congue iaculis eu in ipsum. </p>
</div>
</div>
</div>

<div id="footer"></div>
</div>


</div>
</body>
</html>