...

View Full Version : Resolved Theme/CSS behaves strange in Google Chrome (tumblr)



ifruits
08-06-2011, 02:15 PM
I'm not a CSS/html genius (not at all!), so there might be quite a lot of obvious mistakes in it or things like that...

Anyway, I was playing around with my theme yesterday and changing some things in it. But all of that suddenly--I don't know what I did wrong--the hyperlinks in the posts wouldn't work anymore until I scrolled down. I checked it in firefox and IE and the links work fine in both (well, it looks weird in IE but that's not the problem). It's really strange because all I can remember when it happened was changing the width of the music player in the theme and I changed it back, but it didn't fix the problem.

Here is a link so you can see it yourself: http://hypphe.tumblr.com/

And this is the code:

<script type="text/javascript">

var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-22640282-5']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();

</script>

<!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" xml:lang="en" lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.js" type="text/javascript"></script>

<!--
Blank Canvas theme for Tumblr
Created by Aiurare
-->

<title>{title}</title>
<meta name="color:Background" content="#FFFFFF"/>
<meta name="color:Text" content="#555555"/>
<meta name="color:Links" content="#000000"/>

<meta name="font:Body" content="Times New Roman"/>

<meta name="text:Font Size" content="12"/>
<meta name="text:Post Gaps" content="25"/>
<meta name="image:Background" content=""/>
<meta name="image:Permalink" content=""/>
<meta name="if:Uppercase Title" content="0"/>
<meta name="if:Align Left" content="0"/>
<meta name="if:Align Right" content="0"/>
<meta name="if:Show Links" content="1"/>
<meta name="if:Use Permalink Image" content="0"/>
<meta name="if:Maximised Background Image" content="0"/>
<meta name="if:Show Captions" content="0"/>
<meta name="if:Side Permalinks" content="0"/>
<meta name="if:Endless Scroll" content="0"/>
<meta name="if:Show Sidebar Image" content="0"/>
<link rel="shortcut icon" href="{Favicon}">

<script type="text/javascript" src="http://static.tumblr.com/twte3d7/BH7lio0yf/jquery.js"></script>
<script type="text/javascript" src="http://static.tumblr.com/twte3d7/RhUlio0y7/lazyload.js"></script>
<script type="text/javascript" charset="utf-8">
var $j = jQuery.noConflict();
$j(function() {
if (navigator.platform == "iPad" || navigator.platform == "iPhone") return;
$j("img").lazyload({
placeholder : "http://static.tumblr.com/twte3d7/RSvlio0k5/grey.gif",
effect: "fadeIn",
});
});
</script>

{block:IndexPage}
<script type="text/javascript">
$(window).load(function(){
$("p").remove(":contains('Source:')");
$("p").remove(":contains('(via')");
});
</script>
{/block:IndexPage}

<style type="text/css">
body{
text-align:justify;
font-family: {font:Body};
font-size: {text:Font Size}px;
line-height: 13px ;
color:{color:text};
background-color:{color:Background};
{block:IfNotMaximisedBackgroundImage}
background-image:url({image:Background});
background-attachment:fixed;
background-position:right;
background-repeat:no-repeat;
{/block:IfNotMaximisedBackgroundImage}
}
.tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
a{
text-decoration:none;
color:{color:links};
-moz-transition: all 0.3s ease-out; /* FF3.7+ */
-o-transition: all 0.3s ease-out; /* Opera 10.5 */
-webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */
transition: all 0.3s ease-out;
}
a:hover{
text-decoration:none;color:#969696;
-moz-transition: all 0.3s ease-out; /* FF3.7+ */
-o-transition: all 0.3s ease-out; /* Opera 10.5 */
-webkit-transition: all 0.3s ease-out; /* Saf3.2+, Chrome */
transition: all 0.3s ease-out;
}
a img{
border:0px;
}

::-webkit-scrollbar-thumb:vertical {background-color:#111;height:100px; !important;}
::-webkit-scrollbar-thumb:horizontal {background-color:#111;height:10px; !important;}
::-webkit-scrollbar { height:10px;width:5px; background-color:#fff;}

#content{
z-index:-1;
top: 0px;
outline:none;
background:#fff;
padding:20px;
{block:IfAlignLeft}
position:absolute;
left:85px;
{/block:IfAlignLeft}
{block:IfAlignRight}
position:absolute;
right:85px;
{/block:IfAlignRight}
margin:auto;
width:400px;
}

#content2{
background:#fff;
padding:20px;
top:200px;
border: solid 1px #E8E8E8;
box-shadowt: 2px 2px 5px -2px #111;
-webkit-box-shadow: 2px 2px 5px -2px #111;
-moz-box-shadow: 2px 2px 5px -2px #111;
outline:none;
{block:IfAlignLeft}
position:fixed;
left:550px;
{/block:IfAlignLeft}
{block:IfAlignRight}
position:fixed;
right:550px;
{/block:IfAlignRight}
margin:auto;
width:200px;
height:120px;
{block:IfShowSidebarImage}
height:220px;
{/block:IfShowSidebarImage} }


{block:IfMaximisedBackgroundImage}
#bg img {
z-index:-1;
position:fixed;
top:0;
left:0;
height:100%;
width:100%;
}
{block:IfMaximisedBackgroundImage}
.blogtitle{
margin:20px 0 0px 0;
text-align:center;
font-weight:bold;
{block:IfUppercaseTitle}
text-transform:uppercase;
{/block:IfUppercaseTitle}
{block:IfNotUppercaseTitle}
text-transform:lowercase;
{/block:IfNotUppercaseTitle}
line-height:30px;
font-size:25px;
}
.blogtitle a:hover{
text-decoration:none;
}
.nav {
text-transform:lowercase;
text-align:center;
margin-bottom:30px;
}
.player{
width:400px;
overflow:hidden;
background:#000;
}
h2{
font-size:12pt;
}
{block:IfSidePermalinks}
.permalink{
opacity:0;
position:absolute;
float:left;
padding-left:15px;
margin-left:400px;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}

#post:hover .permalink{
opacity:1;
-moz-transition: all 0.3s ease-out;
-o-transition: all 0.3s ease-out;
-webkit-transition: all 0.3s ease-out;
transition: all 0.3s ease-out;
}
{/block:IfSidePermalinks}
{block:IFNotSidePermalinks}
.permalink{
margin:10px 0px 10px 0px;
text-align:center;
font-size:8pt;
}
{/block:IfNotSidePermalinks}
.permalink img{
max-width:30px;
max-height:30px;}

.pagination{
margin-bottom:15px;
font-size:8pt;
font-style:normal;
text-align:center;
}
.current_page{
font-style:italic;
}

#entry{ z-index:999;margin-bottom:5px;background-color:#fff;padding:10px;border: solid 1px #E8E8E8;
box-shadowt: 2px 2px 5px -2px #111;
-webkit-box-shadow: 2px 2px 5px -2px #111;
-moz-box-shadow: 2px 2px 5px -2px #111;
outline:none;
width:400px;
text-align:justify;
margin-bottom:{text:Post Gaps}px;
}

#entry img{z-index:999;
max-width:400px;
/* for IE */
filter:alpha(opacity=60);
/* CSS3 standard */
opacity:0.6;
-moz-transition: all 0.6s ease-out; /* FF3.7+ */
-o-transition: all 0.6s ease-out; /* Opera 10.5 */
-webkit-transition: all 0.6s ease-out; /* Saf3.2+, Chrome */
transition: all 0.6s ease-out;
}

#entry img:hover{ z-index:999;
max-width:400px;
/* for IE */
filter:alpha(opacity=100);
/* CSS3 standard */
opacity:1.0;
-moz-transition: all 0.6s ease-out; /* FF3.7+ */
-o-transition: all 0.6s ease-out; /* Opera 10.5 */
-webkit-transition: all 0.6s ease-out; /* Saf3.2+, Chrome */
transition: all 0.6s ease-out;
}

div.video embed,
div.post div.video object {
width:400px !important;
height:200px !important;
}
ol.notes {
padding: 0px;
margin: 20px 0px 0px 0px;
list-style-type: none;
}
ol.notes li.note {
padding: 5px;
}
ol.notes li.note img.avatar {
vertical-align: -4px;
margin-right: 10px;
opacity:1;
width: 20px;
height: 20px;
}
ol.notes li.note span.action {
font-weight: normal;
}
ol.notes li.note span.action a {
font-style:italic;
}

#won a {height:14px;display:block;width:200px;background-color:#787878;margin-bottom:5px;text-transform:lowercase;font-size:12px;text-align:center;font-variant: small-caps;letter-spacing:3px;color:#fff;}
#won a:hover {background-color:#D4D4D4;text-align:center;border-left:solid 4px #696969;font-variant: small-caps;letter-spacing:3px;color:#969696;}

{CustomCSS}

</style>

{block:IfEndlessScroll}<script type="text/javascript" src="http://static.tumblr.com/q0etgkr/J5bl3lkz1/tumblrautopagernopage.js"></script>{/block:IfEndlessScroll}

</head>

<body>

{block:IfMaximisedBackgroundImage}<div id="bg"><img src="{image:Background}"></div>{/block:IfMaximisedBackgroundImage}


<div id="content2">
{block:IfShowSidebarImage}
<div style="width:140px;height:100px;overflow:hidden;"><center><img style="border:none;max-width:140px;min-width:140px;" src="{image:Sidebar}"></div><br>
{/block:IfShowSidebarImage}
<div class="nav"><div id="won"><embed src="http://www.sheepproductions.com/billy/billy.swf?autoplay=false&f0=http://fisheyetunes.com/wp-content/uploads/2011/04/03-Baltimores-Fireflies.mp3&t0=03-Baltimores-Fireflies&total=1" quality="high" wmode="transparent" width="200" height="10" name="billy" align="middle" type="application/x-shockwave-flash" /></center><br><br>{block:IfShowLinks}<a href="/"><span>home</span></a><a href="/archive"><span>archive</span></a><a href="http://fauntis.tumblr.com/"><span>other</span></a>{block:AskEnabled}<a href="/ask"><span>ask</span></a>{/block:AskEnabled}{block:HasPages}{block:Pages}<a href="{URL}"><span>{Label}</span></a>{/block:Pages}{/block:HasPages}{/block:IfShowLinks}</div>

{block:IfNotEndlessScroll}
{block:Pagination}
<div class="pagination">
{block:PreviousPage}
<a href="{previouspage}"><span style="font-size:12px">↗&nbsp;</style></a>
{/block:PreviousPage}

{block:NextPage}
<a href="{nextpage}"><span style="font-size:12px;">↙&nbsp;</style></a>
{/block:NextPage}<br>
<span style="font-size:8px;color:#787878;">{currentpage}/{totalpages}</span>
</div>
{/block:Pagination}
{/block:IfNotEndlessScroll}
</div></div>

<div id="content">

{block:IfEndlessScroll}<div class="autopagerize_page_element">{/block:IfEndlessScroll}

{block:Posts}
<div id="entry">

{block:IfSidePermalinks}{block:IndexPage}<div class="permalink"><a href="{Permalink}">{block:IfUsePermalinkImage}<img src="{image:Permalink}">{/block:IfUsePermalinkImage}{block:IfNotUsePermalinkImage}{block:Date}{NoteCount}{/block:Date}{/block:IfNotUsePermalinkImage}</a></div>{/block:IndexPage}{/block:IfSidePermalinks}

{block:Text}
{block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title}
{Body}
{/block:Text}

{block:Photo}
{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="400"/>{LinkCloseTag}
{block:IfShowCaptions}{block:IndexPage}{block:Caption}{Caption}{/block:Caption}{/block:IndexPage}{/block:IfShowCaptions}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
{/block:Photo}

{block:Photoset}
<center>{Photoset-250}</center>
{block:IfShowCaptions}{block:IndexPage}{block:Caption}{Caption}{/block:Caption}{/block:IndexPage}{/block:IfShowCaptions}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
{/block:Photoset}

{block:Quote}
"{Quote}"
{block:Source}<p>&mdash; <b>{Source}</b></p>{/block:Source}
{/block:Quote}

{block:Link}
<a href="{URL}"><h2>{Name}</h2></a>{block:Description}{Description}{/block:Description}
{/block:Link}

{block:Chat}
{block:Title}<b>{Title}</b>{/block:Title}
{block:Lines}{block:Label}<b>{Label}</b> {Line}<br>{/block:Label}{/block:Lines}
{/block:Chat}

{block:Audio}
<div class="player">{AudioPlayerBlack}</div>
{block:Caption}{Caption}{/block:Caption}
{/block:Audio}

{block:Answer}
{Asker}: {Question}
{Answer}
{/block:answer}

{block:Video}
<div class="video">{Video-400}</div>
{block:IfShowCaptions}{block:IndexPage}{block:Caption}{Caption}{/block:Caption}{/block:IndexPage}{/block:IfShowCaptions}{block:PermalinkPage}{block:Caption}{Caption}{/block:Caption}{/block:PermalinkPage}
{/block:Video}

{block:IfNotSidePermalinks}{block:IndexPage}<div class="permalink"><a href="{Permalink}">{block:IfUsePermalinkImage}<img src="{image:Permalink}">{/block:IfUsePermalinkImage}{block:IfNotUsePermalinkImage}{block:Date}{TimeAgo}{/block:Date}{/block:IfNotUsePermalinkImage}</a></div>{/block:IndexPage}{/block:IfNotSidePermalinks}

{block:PermalinkPage}
{block:Date}Posted {TimeAgo} with {NoteCountWithLabel}{/block:Date}{block:HasTags}<br>Tags:&nbsp;{block:Tags}<a href="{TagURL}"><span style="{color:Links}; color:{color:Text}; line-height:14px;">{Tag}</span></a>&nbsp;&nbsp;{/block:Tags}
{/block:HasTags}{/block:PermalinkPage}

{block:PostNotes}{PostNotes}{/block:PostNotes}


</div>
{/block:Posts}
{block:IfEndlessScroll}</div>{/block:IfEndlessScroll}



<center><small><span style="color:#111;"><a href="http://themesbyrawmoans.tumblr.com"><span style="color:#111;">theme</style></a>/<a href="http://atmosthemes.tumblr.com/"><span style="color:#111;">theme</style></a> with modifications</style></small></center>
</div>

</body>
</html>

Sammy12
08-07-2011, 08:07 AM
link doesn't work.

my suggestion is not to touch script that you didn't make. changing widths, heights, and even colors can mess up more than you know.

like all tumblr posts, the poster never comes back...it makes me not want to help all tumblr posts

update the link so we can see a live copy of the website

ifruits
08-08-2011, 03:40 AM
Sorry I already fixed it before the thread even got published. I'm a little late with saying that, so sorry for that.

Sammy12
08-08-2011, 03:46 AM
every single tumblr thread either goes unanswered or just left like this...this is my last post regarding tumblr



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum