Struggling with my one-page website layout, I made some adjustments to have six sections in the HTML. Everything seemed to work fine on all browsers except for Internet Explorer. It kept redirecting me to a weird spot between the second last and last two sections (after adding an extra section). Removing the JS query didn't solve the issue, confirming my suspicion that it might be related to CSS. Being new to web design, I'm not sure what needs tweaking. Please check out the code below (without the additional section):
HTML:
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- code snippet continues -->
CSS:
body{
margin: 0;
padding: 0;
color: #ddd;
font-size: 12px;
line-height: 1.6em;
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
background-color: #000;
}
<!-- CSS styles continue -->
<p>I suspect the issue lies in either of these areas:</p>
<pre><code> #templatemo_main {
width: 800px;
height: 487px;
overflow: hidden;
margin: 0 auto;
}
or here:
#content{
overflow:hidden;
width: 7000px;
position:relative;
height: 487px;
}
If you have any suggestions or solutions, please let me know. Your help would be greatly appreciated!
Note: As a newcomer to Stack Overflow, I'm unsure if this is the right type of question for this platform. Feedback on this would be helpful! :)