Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations biv343 on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

3px margin bug (IE6 and below)

Status
Not open for further replies.
Zhris

Zhris

Programmer
Aug 5, 2008
254
GB
I have created a group of stylesheets, each designed to manipulate a single xhtml document and produce varying layouts. The project is almost complete, however I am having problems with a particular stylesheet which has a 3px vertical margin between the logo and the title in IE6 and below. Note that I have a similar stylesheet where the wrapper is of a fixed width instead of 100%, which works absolutely perfectly.

You can view the page at:

A screenshot showing the bug in IE6 can be viewed at:

I saw this link ( whilst searching Google for a solution, and I believe this is what I am looking for. However I have tried to apply this to my webpage with no success.

Is this the problem I am encounting, and if so any suggestions on implementing it in my case? I am lost at this time.

Thank you,

Chris
 
Sort by date Sort by votes
Ah, i'm so sorry, I was testing to see if the bug occurred if I removed the logo, its back to how it should be now. You can see from the screenshot how it appears in IE6. I apologise again, it is still an issue.

Thanks,

Chris
 
Upvote 0 Downvote
Given your logo areas never seems to change in width or height, why not get rid of the both the header floats altogether, and absolutely position the logo box?

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:
Code Couch Tech Snippets & Info:
 
Upvote 0 Downvote
Thanks, that would work. My eventual aim is to be able to use this template as a basis for a content management system therefore I want to be slightly flexible and think about the possibility that the logo/title will not necessarily have a fixed height. Would there be a way to position a div absolutely without specifying a height (something like height: auto;).

Chris
 
Upvote 0 Downvote
You can, yes - just omit the height altogether. However, if the idea is that the top-left and top-right DIVs are always of equal height (being the maximum height or either), then assuming content in both DIVs would grow, absolutely positioning would not work.

It really depends on your ultimate goal, because right now, the DIV with the nav in doesn't grow, even if you increase the font size a few times.

Dan



Coedit Limited - Delivering standards compliant, accessible web solutions

Dan's Page [blue]@[/blue] Code Couch:
Code Couch Tech Snippets & Info:
 
Upvote 0 Downvote
Just noticed your response. I decided to go with absolute positioning the left logo which worked fine as you suggested. I'm still keen to fix the margin bug as its a single small issue and there must be a solution. Thank you for your help, its greatly appreciated.

Chris
 
Upvote 0 Downvote
Hi Chris,
tried to validate your page and the validator stumbled on the first few lines and couldn't validate the page at all. Note that the DOCTYPE has a slash at the end which isn't supposed to be there if I'm correct. Apologies if I am wrong. This is what your DOCTYPE looks like :-

Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"[/URL] [COLOR=red]/[/color]>

If the slash / at the end is removed it may help.

Not a criticism, I just like my pages to fully validate.

Steve
 
Upvote 0 Downvote
Hi Steve,

I just re-validated it on the W3 website and I had no problems.

The trailing slash is basically a self closing tag style (for single tags which don't have a closing tag). If there isn't a closing tag I will leave a space (I read that this is to ensure really old browsers ignore it, and continue) then follow with a forward slash.

An example could be:
<br>Hello</br>
or:
<br />Hello

Other websites / books don't use this trailing slash, however I have seen it before. I'm unsure whether I should remove it.

Thanks for noticing,

Chris
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

cae154
  • Locked
  • Question
Body of email not appearing in correct font on iPhone and iPad
Replies
1
Views
827
spamjim
spamjim
lmcate
  • Locked
  • Question
From HTML Page open an MDB files on the server and work
Replies
0
Views
236
lmcate
lmcate
PeDa
  • Locked
  • Question
Horizontal rule and CSS problem 2
Replies
2
Views
706
PeDa
PeDa
jason.lex
  • Locked
  • Question
Bootstrap grid and columns question
Replies
0
Views
152
jason.lex
jason.lex
jason.lex
  • Locked
  • Question
iPhone browsers (chrome and safari) output different compared to other browsers 1
Replies
2
Views
160
jason.lex
jason.lex

Part and Inventory Search

Sponsor

Back
Top