Hi, this is my first post in this forum, since Ive been having this head aches trying to get this code working but nothing, so i decided to look for somehelp in the css community .
I am coding this website but is giving me such a problem with IE, i guess thats normal...Im having pixels gap in two part of my website, first, right after my header and second and most important is with my main content margin. I have a basic template with header sidebar, maincontent and footer, the sidebar is floated left and the main content just follows the flow of the document and stays away from the side bar with a margin big enough for this purpose. BUt "somehow" it works perfectly everywhere but in IE6, the main content is getting an extra space of 3px at the left and being pushed down of its position.
this is the link of the website
id like to know what am i missing here, cause ive tried so many things, even the zoom : 1px; but nothing.
thanks in advance :thumbsup:
Hee, I think that your content and side bars widths added together are greater than the width of the mainwrapper. for this reason your content goes down, reduce the size until you get them in the right place.
That might of solve the
That might of solve the problem for IE6 but what about the rest of the browsers? I just want a code to let me put my template without this problem, and theres a swf embeded with a certain width so its not like a text that you can just move here and there and put the container divission smaller without problems, any other tips? please
What solved the problem for me was putting all the code on one line for the offending image. For example, my original code looked like this:
<div style="position:relative;"> <img src="/images/order_DP.jpg" alt="some text here"/> <div class="whitetext" style="position:absolute;top:127px;left:187px; width:220px;text-align:center;"> Some other text went here. </div> </div>
When I put that all on a single line, the 3 pixels were gone.
<div style="position:relative;"> <img src="/images/order_DP.jpg" alt="some text here"/><div class="whitetext" style="position:absolute;top:127px;left:187px; width:220px;text-align:center;">Some other text went here.</div> </div>
I don't know the technical stuff behind it, but it works for me in all the cases where I had 3 pixel issues previously.