View Full Version : Another IE7 problem.

12-15-2006, 03:22 AM

I have a page - http://moderntimes.com -, and the copyright statement at the bottom does not line up correctly. The symbol is out of alignment. I tried shortening it, but no matter how short I made it, it still put the first word outside of the CSS boundaries. I'm not even certain if I'm explaining it properly.

Any suggestions. . .

12-15-2006, 04:35 AM
Hi michael180,
I might put it in a separate div... or not.
This works though:

<DIV id=bottom><IMG height=40 alt=bottom_strip
src="Moderntimes%20Classic%20Film%20Pages_files/bottom_strip.gif" width=633><A
1995-2007 moderntimes | all rights

"I just added a <br>"

12-15-2006, 04:45 AM
...adding to Excavator's fix (had not seen this post)

Not just IE7, but also IE6 shows the unwanted display you describe.

You have an inline image (bottom slice) directly followed by the inline <a> link element (starting with the copyright symbol)

<div id="bottom"><img src="bottom_strip.gif" alt="bottom_strip" width="633" height="40"/><a href="mailto:xxx">&copy; 1995-2007
moderntimes | all rights reserved</a></div>

IE and FF both correctly treat the <img...> element like any other character. But, what IE and FF don't have in common is that IE will not allow wrapping between the image and whatever character that may follow unless there is inserted a newline or space character in the source code. What is more, IE will also expand the width of your bottom div overriding your explicit width declaration of your bottom div when it finds that contents no longer fit in.

You may simply just add a newline character like this to make it work:

<div id="bottom"><img src="bottom_strip.gif" alt="bottom_strip" width="633" height="40"/>
<a href="mailto:xxx">&copy; 1995-2007
moderntimes | all rights reserved</a></div>

12-15-2006, 05:00 AM
Hi koyama,
I don't see the 'newline character' of which you are speaking, am I missing something? Thanks though for your prompt response.

12-15-2006, 05:05 AM
Sorry for being imprecise.

Notice the linebreak between the the <img...> and the <a...> in the second block. (Just hit the 'enter' button on you keyboard.) It is as simple as that:)

12-15-2006, 05:09 AM
Hi koyama,
Yes! It works like a charm. I'll have to remember that. Again thank you very much.