Google Chrome Drama

[zilla]

Hi
I've just downloaded the beta of Google Chrome and it seems to do odd things with my layout...
see here www.ukbikegear.com
i've tried to work out what's causing it, but no luck... hopefully someone here will come to my aid!
cheers
john

[misty]

Suggest you query problem with template designer.

[zilla]

yeah, just waiting for a call back from them - i was hoping it might be something i could fix without them

[drkramer]

I sent a copy to the google people. There is a link under the page icon in chrome to report an issue.

[clydejones]

One thing I did notice was that the class declaration

clearboth (this is as it appears when you view the source of your page) and only for sections of the header portion of the page.

does not match the declaration in the stylesheet.css which is

.clearBoth

<div class="header01">
<a href="http://www.ukbikegear.com/"><img class="logopoz01" src="includes/templates/jsweb/images/design/logo.jpg" border="0" alt="" /></a>
</div>

<br class="clearboth" />
<div>
<div id="login_header" class="back"><form name="account_box" action="https://www.ukbikegear.com/index.php?main_page=login&amp;action=process" method="post">
<table border="0" cellspacing="0" cellpadding="0">
<tr> 
<td align="center" valign="middle" class="text_top">Login&nbsp;</td>
<td align="center" valign="middle">&nbsp;<input type="text" name="email_address" size="15" value="e-mail" onfocus="if (this.value == 'e-mail') this.value = '';" onblur="if(this.value=='')this.value='e-mail';" />&nbsp;</td>
<td align="center" valign="middle" class="text_top">&nbsp;</td>
<td align="center" valign="middle">&nbsp;<input type="password" name="password" size="15" value="password" onfocus="if (this.value == 'password') this.value = '';" onblur="if(this.value=='')this.value='password';" />&nbsp;</td>
<td align="center" valign="middle">&nbsp;<input type="image" src="includes/templates/jsweb/images/design/login.jpg" alt="Login" title=" Login " /></td>
</tr>
</table></form>
	</div>
<div id="cart_header" class="back scpoz"><div><a href="http://www.ukbikegear.com/index.php?main_page=shopping_cart ">Shopping Cart</a>:&nbsp;&nbsp;Item(s)&nbsp;<font class="font_red"><B>0</B></font>&nbsp;|&nbsp;Total:&nbsp;<font class="font_red"><B>&pound;0.00</B></font></div></div>

<br class="clearboth" />
</div>
<br class="clearboth" />
<br class="clearboth" />

I'd suggest going through tpl_header.php and correct the those clearboth calls and that should clear up the problem.

[rstevenson]

The rendering engine in Google Chrome is WebKit, the same rendering engine used in Safari. So if you're surprised at what your site looks like in Chrome, you didn't check it out in Safari. You'd be surprised at what it looks like in that browser too!

Rob

[zilla]

thanks for your replies... and thanks drkramer for sending the report for me... my knowledge of chrome is currently zero!
thanks for your suggestion clydejones... i'll have a look at that when i get into work and report back :)
and finally... rstevenson, thanks, just thanks for making my morning! lol ... I foolishly thought when i purchased the basic template that it would have been tested on the major browsers so didn't bother checking it myself (still, you live and learn!), hopefully the fix clydejones has suggested will solve my problems with both at the same time. :)

[zilla]

I've just changed the clearboth calls and no change unfortunately (i found 4 in tpl_header).
What i have noticed is that I can "highlight" the extra white space after the login section as if it's an image on each line, if that makes sense?

[Website Rob]

Not sure how important HTML Validation is to you nor how Google Chrome treats validation, but you might want to fix up some the coding errors in your Template.

[zilla]

thanks for that Rob, definitely something i know i should do. i'm not sure it should break the template though?
i've made a start though... anything is worth a try :)