In IE7 against the day, the strange horizontal scroll bar

First of all, I will introduce some modules, such as the document list or post list, on our webpage. Of course there are other modules that will also be involved. I will mainly talk about the situations that people often encounter. Here I will use the document list as an example. The document list contains the title, description, author, and time of an article. What does it look like?

See:

The above is what I want.

But what problems have I encountered? Let's look at it again:

 

 

 

No. In IE7 against the day, a horizontal scroll bar exists. I don't understand how I offend him. He treats me like this. After several hours of fighting with him, I finally knew his weakness.

At first I looked for the reason. Debug with F12. After searching for half a day, I couldn't find out where it exceeded. Is there a ghost next to it? It's not scientific.

 

But I thought about it. What if I change a tag. It is italic by default .) So I changed the <I> label to the <span> label. There is no exception. It does not seem to be the reason for floating and absolute positioning. I think: The two wonderful labels are intra-Row Labels. The only difference is that the font of the <I> label is oblique. Well, I describe the <span> label as italic, if there is a problem, it is the problem of italic. At first, I was bored and wanted to try it. I thought it could not be italic. However, my friends and I were shocked by what happened later. After being changed to italic, the horizontal scroll bar came out. IE7, what is your exercise?

This is the reason why I used it for half a day.

So there are also solutions. There are two types.

First, if you want to retain italics, add a fixed height to your tag.

2. If you do not need italics, add font-style: normal.

Of course, I still use absolute positioning in floating positioning. This allows for accurate and simple positioning.

I have also made several comments. You can try it. The debugging of IE7 is really interesting. I hope you can share your questions more.

The Code is as follows:

 

<! DOCTYPE html>