Note that there are some explanatory texts on larger screens.

plurals
  1. POWeird Chrome problem
    text
    copied!<p>I've got a problem and I'm desperate for help. </p> <p>I needed for some reason to render table header and table body separately. Each column and header cell have got same css class (eg. .col1_name). Those css classes have got declared width and text-align, and in that manner i'm making sure that header and table body cells stay aligned properly. </p> <p>And, everything is OK in IE8 and Firefox. I've got problems with WebKit browsers (Chrome and Safari. Chrome is important for me.) They are rendering width of table body cells 5px less than IE and FF. I could not trace the problem, but I saw that those -5px widths are in Computed styles. </p> <p>Below are s-shots and some sample code. <a href="http://img191.imageshack.us/img191/2360/probie8.png" rel="nofollow noreferrer">IE 8 Is just fine http://img191.imageshack.us/img191/2360/probie8.png</a></p> <p><a href="http://img705.imageshack.us/img705/661/probff.png" rel="nofollow noreferrer">Firefox is just fine http://img705.imageshack.us/img705/661/probff.png</a></p> <p><a href="http://img199.imageshack.us/img199/5176/probgc.png" rel="nofollow noreferrer">Google Chrome is not so fine http://img199.imageshack.us/img199/5176/probgc.png</a></p> <p><a href="http://img96.imageshack.us/img96/19/probj.png" rel="nofollow noreferrer">Inspecting element ... http://img96.imageshack.us/img96/19/probj.png</a></p> <pre><code>&lt;style type="text/css"&gt; .rbr{ width: 45px; text-align: left;} .sifra {width: 90px; text-align: left;} .naziv { width: 240px; text-align: left;} .kolicina {width: 90px; text-align: right;} .cena {width: 60px; text-align: right;} &lt;/style&gt; &lt;table id="tableheader"&gt; &lt;thead&gt; &lt;tr&gt; &lt;th class="rbr"&gt;RB.&lt;/th&gt; &lt;th class="sifra"&gt;Sifra&lt;/th&gt; &lt;th class="naziv"&gt;Naziv&lt;/th&gt; &lt;th class="kolicina"&gt;Kolicina&lt;/th&gt; &lt;/tr&gt; &lt;/thead&gt; &lt;/table&gt; &lt;table id="tablebody"&gt; &lt;tbody&gt; &lt;tr&gt; &lt;td class="rbr"&gt;1&lt;/td&gt; &lt;td class="sifra"&gt;11111112&lt;/td&gt; &lt;td class="naziv"&gt;Adelante 3 series&lt;/td&gt; &lt;td class="kolicina"&gt;2.00&lt;/td&gt; &lt;/tr&gt; &lt;tr&gt; &lt;td class="rbr"&gt;2&lt;/td&gt; &lt;td class="sifra"&gt;86868631&lt;/td&gt; &lt;td class="naziv"&gt;Canyon CNR&lt;/td&gt; &lt;td class="kolicina"&gt;1.00&lt;/td&gt; &lt;/tr&gt; &lt;/tbody&gt; &lt;/table&gt; </code></pre> <p>Many thanks people for any help!</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload