Frage Der rechte Rand wird nicht in Google Chrome angezeigt


Ich habe ein div welches enthält ein a mit etwas Grenze. Sehen:

http://webnumbr.com/all

Es funktioniert hervorragend in FF und IE, aber warum wird die rechte Seite nicht in Chrome gerendert? Ist es ungültig CSS? (Testen in Chrome OSX, wenn das wichtig ist)


5
2018-01-17 20:11


Ursprung


Antworten:


Testfall: Eingeschlossen, damit diese Frage noch Sinn macht, nachdem sich der Inhalt an der gegebenen URL ändert:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" 
  "http://www.w3.org/TR/html4/strict.dtd">
<html><head><style type="text/css">
div {
  float: left;
  clear: left;
  margin: 3px;
}
span {
  border: 1px solid;
}
</style></head><body>

<!-- does not show right border -->
<div><span>With trailing space, no width </span></div> 

<!-- does show right border -->
<div><span>No trailing space, no width</span></div>
<div style="width: 40ex;"><span>With trailing space, has width </span></div>
<div style="width: 40ex;"><span>No trailing space, has width</span></div>

</body></html>

Bestätigt in Google Chrome 4.0.266.0 (Offizielle Build 33992) mit WebKit 532.6.


8
2018-01-17 21:40



Ich kann Ihnen nicht den Grund nennen, warum das passiert, aber ich denke, ich habe eine Lösung für Sie. Sie haben Leerzeichen auf Ihrem Link-Inhalt und anscheinend geht Chrome damit nicht gut um.

Wenn Sie den zusätzlichen Abstand um den Inhalt des <a> Tags, das Problem verschwindet (ich habe dies im Chrome-Inspektor-Tool getan). Also, ändere:

<a href="pclark-hacker-news-karma"> 4,481 </a>

zu:

<a href="pclark-hacker-news-karma">4,481</a>

Beim Umgang mit einem Gleitkomma muss Chrome den Raum auf seltsame Weise behandeln (wenn Sie die Eigenschaft float auf der Ebene entfernen) search_data Klasse, die Grenze erscheint ebenfalls).


6
2018-01-17 20:39