...

View Full Version : Website not working in Chrome



kiholm
12-23-2010, 08:11 PM
Hi,

I'm new here, but have a problem I just can't seem to solve and it seems like a great forum for help.

I recently updated my website (mostly the design), but have problems making it work in google chrome (it was displayed nicely until version 7) and IE 8. Also firefox 4 stopped showing it the way it used to look (previous version no problem).

The problem is that some of the content is missing (no twitter box, no background in the "container" and no links in the bottom of the page).

I didn't change anything and really can't get my head around this problem.

The website is www.kiholm.com

Hope to hear from some of you.

Thank you in advance :)

(And here is the rough code)


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Kiholm | Official website of the Danish DJ/Producer Mads Kiholm</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1257">
<meta name="Keywords" content="Kiholm, Mads, Mads Kiholm, www.kiholm.com, kiholm.com, trance, enhanced, asot, tatw" />
<meta name="description" content="Kiholm - Trance producer from Denmark." />
<style type="text/css">

body {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
line-height: 1.4;
font-size: 10pt;
background-image: url(images/blocks.png);
background-repeat: repeat;
}


ul, ol, dl {
padding: 0;
margin: 0;
}
h1, h2, h3, h4, h5, h6, p {
margin-top: 0;
padding-left: 0px;
}
a img {
border: none;
}

a:link {
color: #CCC;
text-decoration: none;
}
a:visited {
color: #CCC;
text-decoration: none;
}
a:hover, a:active, a:focus {
text-decoration: none;
color: #CCC;
}

.container {
width: 688px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
background-image: url(images/back.png);
background-repeat: repeat;
}


.header {
background-image: url(../HTML/Top_logo.png);
height: 226px;
width: 688px;
text-align: center;
color: #9C0;
}


.sidebar1 {
float: left;
width: 180px;
background: #EADCAE;
padding-bottom: 10px;
}
.content {
width: 496px;
float: left;
padding-top: 0;
padding-right: 0;
padding-bottom: 5px;
padding-left: 0;
}
.sidebar2 {
float: right;
width: 190px;
/* [disabled]background-color: #FFF; */
padding-top: 2px;
padding-right: 0px;
padding-bottom: 5px;
padding-left: 2px;
}


.content ul, .content ol {
padding: 0 15px 15px 40px;
}

ul.nav {
list-style: none;
border-top: 1px solid #666;
margin-bottom: 15px;
}
ul.nav li {
border-bottom: 1px solid #666;
}
ul.nav a, ul.nav a:visited {
padding: 5px 5px 5px 15px;
display: block;
width: 160px;
text-decoration: none;
background: #C6D580;
}
ul.nav a:hover, ul.nav a:active, ul.nav a:focus {
background: #ADB96E;
color: #FFF;
}

.footer {
position: relative;
clear: both;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
border-top-style: solid;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-color: #000;
border-right-color: #000;
border-bottom-color: #000;
border-left-color: #000;
font-size: 9pt;
}

.fltrt {
float: right;
margin-left: 8px;
}
.fltlft {
float: left;
margin-right: 8px;
}
.clearfloat {
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}

.container .footer table tr td {
font-size: 8pt;
}
.container .content table tr td {
font-size: 9pt;
text-align: justify;
}
#apDiv1 {
position:absolute;
left:166px;
top:187px;
width:670px;
height:34px;
z-index:888;
color: #FFF;
text-align: center;
font-size: 16px;
overflow: auto;
}
.container .header table tr td {
font-size: 12pt;
color: #FFF;
}
a:hover {
text-decoration: none;
color: #FFF;
}
a:active {
text-decoration: none;
}
</style>
<script type="text/javascript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
</script>
</head>

<body onload="MM_preloadImages('../HTML/twitter2.png','../HTML/facebook-icon2.png','../HTML/soundcloud2.png','../HTML/myspace_logo2.png','../HTML/youtube_logo2.png','images/button1hoover.png','images/button2hoover.png','images/button3hoover.png','images/button5hoover.png','images/button6hoover.png','images/button7hoover.png','images/button4hoover.png')">
<div class="container">
<p><img src="images/logo.png" alt="" name="logo" width="687" height="200" id="logo" /><a href="news.html" target="iframe1" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu1','','images/button1hoover.png',1)"><img src="images/button1.png" name="menu1" width="98" height="42" border="0" id="menu1" /></a><a href="biography.html" target="iframe1" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu2','','images/button2hoover.png',1)"><img src="images/button2.png" name="menu2" width="98" height="42" border="0" id="menu2" /></a><a href="disco.html" target="iframe1" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu3','','images/button3hoover.png',1)"><img src="images/button3.png" name="menu3" width="98" height="42" border="0" id="menu3" /></a><a href="media.html" target="iframe1" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu4','','images/button4hoover.png',1)"><img src="images/button4.png" name="menu4" width="98" height="42" border="0" id="menu4" /></a><a href="photo.html" target="iframe1" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu5','','images/button5hoover.png',1)"><img src="images/button5.png" name="menu5" width="98" height="42" border="0" id="menu5" /></a><a href="press.html" target="iframe1" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu6','','images/button6hoover.png',1)"><img src="images/button6.png" name="menu6" width="98" height="42" border="0" id="menu6" /></a><a href="contact.html" target="iframe1" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('menu7','','images/button7hoover.png',1)"><img src="images/button7.png" name="menu7" width="98" height="42" border="0" id="menu7" />
</a><object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="400" height="15" align="middle" class="clearfloat" id="xspf_player">
<param name="allowScriptAccess" value="sameDomain">
<param name="movie" value="http://kiholm.com/xspf_player_slim.swf?playlist_url=http://kiholm.com/songs.xspf&repeat_playlist=true&player_title=Press play to listen to the sound of Kiholm">
<param name="quality" value="high">
<param name="bgcolor" value="#e6e6e6">
<embed src="http://kiholm.com/xspf_player_slim.swf?playlist_url=http://kiholm.com/songs.xspf&repeat_playlist=true&player_title=Press play to listen to the sound of Kiholm" quality="high" bgcolor="#e6e6e6" name="xspf_player" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" align="center" height="15" width="687">
</object></p>
<div class="content">
<div id="frameholder">
<tr><td>
<iframe name="iframe1" src="news.html" width="490" height="435" frameborder="NO" align="left"</iframe>
</td></tr>
</div>
</div>
<div class="sidebar2">

<script src="http://widgets.twimg.com/j/2/widget.js"></script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 4,
interval: 6000,
width: 188,
height: 300,
theme: {
shell: {
background: '#7d2424',
color: '#ffffff'
},
tweets: {
background: '#e8dfdf',
color: '#000000',
links: '#871d1d'
}
},
features: {
scrollbar: false,
loop: false,
live: false,
hashtags: true,
timestamp: true,
avatars: false,
behavior: 'all'
}
}).render().setUser('mKiholm').start();
</script>

</div>
<div class="footer">
<table width="694" border="0" align="center">
<tr>
<td align="center">All rights reserved &copy; 2010 www.kiholm.com - Website by Mads Kiholm | Follow Kiholm on :</td>
</tr>
</table>
<table width="313" border="0" align="center">
<tr>
<td width="281"><a href="http://twitter.com/mkiholm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('twitter','','images/twitter2.png',1)"><img src="images/twitter.png" name="twitter" width="50" height="50" border="0" id="twitter" /></a><a href="http://www.facebook.com/kiholm2"> </a><a href="http://www.facebook.com/kiholm2" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('fb','','images/facebook-icon2.png',1)"><img src="images/facebook-icon.png" name="fb" width="50" height="50" border="0" id="fb" /></a><a href="http://soundcloud.com/kiholm"> </a><a href="http://www.soundcloud.com/kiholm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('soundcloud','','images/soundcloud2.png',1)"><img src="images/soundcloud.png" name="soundcloud" width="80" height="58" border="0" id="soundcloud" /></a> <a href="http://www.myspace.com/kiholm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('myspace','','images/myspace_logo2.png',1)"><img src="images/myspace_logo.png" name="myspace" width="50" height="50" border="0" id="myspace" /></a> <a href="http://www.youtube.com/user/mkiholm" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('youtube','','images/youtube_logo2.png',1)"><img src="images/youtube_logo.png" name="youtube" width="50" height="50" border="0" id="youtube" /></a></td>
</tr>
</table>
</div>
</div>
<script src="http://www.google-analytics.com/urchin.js" type="text/javascript">
</script>
<script type="text/javascript">
_uacct = "UA-1659322-1";
urchinTracker();
</script>
</body>
</html>

Excavator
12-23-2010, 08:45 PM
Hello kiholm,
Does clearing the float help?
Try adding this bit in red -

.container {
width: 688px;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
background-image: url(images/back.png);
background-repeat: repeat;
overflow: auto;
}

See how overflow: auto; can clear floats (http://www.quirksmode.org/css/clearing.html) for you.

kiholm
12-25-2010, 02:12 PM
Wow thank you very much Excavator! The background for the container is now working as it should! Still have a problem with the Twitter-box on the right side and the "footer"-part is not even there. I'll read a bit more into the overflow, but if anybody has any pointers how to fix it I would be a very happy man :)

Thanks for your help so far!

alindamarry
12-26-2010, 01:14 PM
welcome dear

kiholm
12-26-2010, 04:52 PM
The sidebar (next to the iframe) is still not showing its content and the footer section is gone in Chrome.

I have tried to fix it like a madman, but can't get my head around it. Any one who can help? :)

oVTech
12-26-2010, 08:08 PM
You are missing a closing bracket in the opening tag of this iframe:


<iframe name="iframe1" src="news.html" width="490" height="435" frameborder="NO" align="left"> </iframe>

This iframe is included in this DIV: <div id="frameholder">

I hope this helps... :)

sarenarichard
12-27-2010, 08:40 AM
Always remember the "overflow" property.

visible: The overflow is not clipped. It renders outside the element's box. This is default

hidden: The overflow is clipped, and the rest of the content will be invisible
scroll The overflow is clipped, but a scroll-bar is added to see the rest of the content

auto: If overflow is clipped, a scroll-bar should be added to see the rest of the content

inherit: Specifies that the value of the overflow property should be inherited from the parent element



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum