The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
 Reply to this topicStart new topic
> Tumblr theme html code question - PLEASE hep., encoding problem cutting off pictures
taylorleighann
post Mar 3 2011, 04:22 PM
Post #1





Group: Members
Posts: 4
Joined: 3-March 11
Member No.: 14,040
The following is my html theme for Tumblr. I edited it myself from 'Unemotional' @ Tumblr. I took away some of the width it was originally & positioned it more to the left but as much as i check over & over, idk why ALL MY PICTURES I REBLOG ON TUMBLR ARE GETTING CUT OFF. How come? Please help, what do I fix on it?


This is my url - http://TaylorLeighann.Tumblr.com
as you can see, all of my pictures are getting cut off :'(

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<!--

'Don't Hang Up' theme for Tumblr by unemotional // http://unemotional.tumblr.com

!-->

<head>
<meta name="color:Background" content="#D3D7DB" />
<meta name="color:Main" content="#FFFFFF" />
<meta name="color:Sidebar" content="#FFFFFF" />
<meta name="color:Post" content="#D3D7DB" />
<meta name="color:Title" content="#55616B" />
<meta name="color:Text" content="#5D6E7A" />
<meta name="color:Link" content="#4D5963" />
<meta name="color:Link Hover" content="#738492" />
<meta name="font:Body" content="Georgia" />
<meta name="font:Title" content="Georgia" />
<meta name="text:Font Size" content="10px" />

<title>{Title}</title>
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}<meta name="description" content="{MetaDescription}" />{/block:Description}

<style type="text/css">

body{color:{color:Text};
background-color: {color:Background};
background-image: url(http://i913.photobucket.com/albums/ac337/KANDIE90/81.gif);
background-attachment: fixed;
background-repeat: repeat;
background-position: center;
font-family:{font:Body};
font-size:{text:Font Size};
line-height: 12px;
text-align:justify;}

a:link, a:active, a:visited{color: {color:Link};
text-decoration: none;}

a:hover {color:{color:Link Hover};
text-decoration: none;}

b, strong {
font-family: verdana;
color: #FF0F9F;
}

i, em {
font-family: futura;
color: #757373;
}

u{
font-family: century gothic;
color:#fff;
text-decoration:none;
}

a img{border: 0px;}

div#main{
margin-left:473px;
margin-top: -14px;
margin-bottom: -8px;
width:440px;
padding:5px;
background-color: {color:Main};
}

div#post{
overflow:hidden;
margin: 0px 4px 0px 4px;
padding-left:7px;
padding-right:7px;
padding-top:7px;
padding-bottom:5px;
background-color: {color:Post};
-moz-border-radius:5px;
-webkit-border-radius:5px;
}

div#sidebar{
float: right;
position: fixed;
top: -2px;
left: 280px;
background-color: {color:Sidebar};
width:200px;
height:100%;
padding-left:8px;
padding-right:8px;
padding-bottom:3px;
padding-top:8px;
}

div#permalink{
display: block;
font-family:{font:body};
padding:1px;
margin-top:10px;
margin-bottom:0px;
font-size:10px;
text-align: center;
text-transform: lowercase;}

.title{color:{color:Title};
font-family:{font:Title};
font-size:14px;
line-height:14px;
letter-spacing:2px;
font-weight:normal;
text-align:center;}

.title1{color:{color:Title};
font-family:{font:Title};
font-size:24px;
line-height:24px;
letter-spacing:2px;
font-weight:normal;
text-align:center;}

.title2{
color:{color:Title};
font-family:{font:Title};
font-size:24px;
line-height:20px;
letter-spacing:0px;}

.title3{
color:{color:Text};
font-family:{font:Title};
font-size:11px;
line-height:11px;
letter-spacing:0px;
font-weight:bold;
text-align:left;}

div.navi a{
display:block;
text-align: center;
padding:3px 0;
border-top: 1px solid {color:Link};
border-bottom: 1px solid {color:Link};
margin-top:-1px; position:relative; z-index:1;
}

div.navi a:hover{
display:block;
padding:3px 0;
border-top: 1px solid {color:Link Hover};
border-bottom: 1px solid {color:Link Hover}
background: transparent};
z-index:2; }
}

blockquote{
border-left-width: 2px;
border-left-style: solid;
border-left-color: {color:Link};
padding:1px;
padding-left: 10px;
padding-bottom:5px;}

</style>

<style type="text/css">{CustomCSS]</style>

</head>
<body>
<div id="main">
<div id="sidebar">

{block:Description}
<center><a href="/"><div style="font-size: 16px; line-height: 15px; margin-bottom:5px;"><i>{Title}</i></div></a>{Description}</center>{/block:Description}
<br>

<div class="navi">
<a href="/archive">archive</a>
<a href="/ask">ask me</a>
<a href="/random">random</a>
<a href="http://unemotional.tumblr.com">theme</a>

<br></div>
<br><br>

<div style="font-size: 40px; font-weight: bold;"><center>{block:NextPage}<a href="{NextPage}"> « </a>{/block:NextPage}{block:PreviousPage}<a href="{PreviousPage}">»</a>{/block:PreviousPage}
{block:PermalinkPagination}
{block:PreviousPost}<a href="{PreviousPost}">« </a>{/block:PreviousPost}{block:NextPost}<a href="{NextPost}">»</a>{/block:NextPost}{/block:PermalinkPagination}
</center></div>
<br>
</div>

{block:Posts}

<a href="{Permalink}"></a>
<div id="permalink" style="letter-spacing:1px;"><a href="{Permalink}"> posted on {Month} {DayOfMonthWithZero}, {Year} ≡ {NoteCountWithLabel}</a></div>
<div id="post">
{block:Text}{block:Title}<div style="margin-bottom:12px; margin-top:-3px;"><span class="title1"><center>{Title}</span></div>{/block:Title}</center><div style="margin:-10px 0 -8px 0; text-align:center;">{Body}</div>{/block:Text}

{block:Photo}
<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>
{block:Caption}<div style="margin:-8px 0 -8px 0; text-align:center;">{Caption}</div>{/block:Caption}{/block:Photo}
{block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}

{block:Quote}<div style="margin-top:-2px; margin-bottom:2px;"><span class="title2"><i><center>{Quote}</i></span> {block:Source}<span class="title3"> {Source}</span></span></div>

{/block:Source} {/block:Quote}

{block:Link}<a href="{URL}" class="link" {Target}><div style="margin-top:-3px;"><span class="title1"><center>{Name}</center></span></div></a>{/block:Link}
{block:Link}{block:Description}<div style="margin:-10px 0 -8px 0;"><center>{Description}</center></div>{/block:Description}{/block:Link}

{block:Chat}<ul class="chat"><div style="margin:-8px 0 -8px 0;">{block:Lines}<li class="user_

{UserNumber}">{block:Label}<span class="label"><b>{Label}</b></span>{/block:Label}&nbsp;{Line}</li>

{/block:Lines}</ul>{/block:Chat}

{block:Audio}
<center><div style="margin:0px 0 0px 0;"><div style="float:center">{AudioPlayerWhite}
</div></center>
{block:Caption}<div style="margin:-10px 0 -9px 0; text-align:center;">{Caption}</div>{/block:Caption}{/block:Audio}

{block:Video}<center>{Video-500}<br>{block:Caption}{Caption}{/block:Caption}</center>{/block:Video}

{block:Answer}
<div style="margin-top:4px;"><center>{Asker} asked: <b>{Question}</b></div>
<div style="margin-top:-8px; margin-bottom:-4px;"><center>{Answer}</div></center>
{/block:Answer}

</div>

{block:PostNotes}

<br><div style="text-align:center; margin-left:15px;">{block:RebloggedFrom}
Via <b><a href="{ReblogParentURL}">{ReblogParentName}</a></b><br>Source <b><a href="{ReblogRootURL}">{ReblogRootName}</a></b> {/block:RebloggedFrom}</div>

{PostNotes}

<center>{block:ContentSource}<a href="{SourceURL}">
{lang:Source}: {block:SourceLogo}
<img src="{BlackLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" />
{/block:SourceLogo} {block:NoSourceLogo}{SourceLink}{/block:NoSourceLogo}</a> {/block:ContentSource}</center>

{/block:PostNotes}
{/block:Posts}
<center>
<br>
<div style="-moz-border-radius:5px; -webkit-border-radius:5px; margin: 0px 4px 5px 4px; padding: 2px; background-color: {color:Post};">Theme by <a href="http://unemotional.tumblr.com" target="_blank"><b>unemotional</b></a> // Best viewed in <a href="http://www.google.com/chrome" target="_blank"><b>Google Chrome</b></a></div>
</center></div>

</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
monoclebunny
post Mar 3 2011, 05:27 PM
Post #2


Member
***

Group: Members
Posts: 35
Joined: 1-March 11
Member No.: 14,015
{block:Photo}
<center>{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>{LinkCloseTag}</center>
{block:Caption}<div style="margin:-8px 0 -8px 0; text-align:center;">{Caption}</div>{/block:Caption}{/block:Photo}
{block:Photoset}<center>{Photoset-500}</center>{block:Caption}{Caption}{/block:Caption}{/block:Photoset}

change the 500 to 250
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
taylorleighann
post Mar 3 2011, 06:08 PM
Post #3





Group: Members
Posts: 4
Joined: 3-March 11
Member No.: 14,040
i changed it to 420 just to make it in the middle, not to small not to big. But it only ranged from 500 to 250? because everytime i put anything other then 500 or 250 it dosnt work.

BUT THANKYOOU!<3
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
monoclebunny
post Mar 3 2011, 06:15 PM
Post #4


Member
***

Group: Members
Posts: 35
Joined: 1-March 11
Member No.: 14,015
that's because tumblr have set sizes for video and photos.

{PhotoURL-500}
{PhotoURL-400}
{PhotoURL-250}
{PhotoURL-100}
{PhotoURL-75sq}

so you can only pick from those unfortunately smile.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
taylorleighann
post Mar 3 2011, 06:27 PM
Post #5





Group: Members
Posts: 4
Joined: 3-March 11
Member No.: 14,040
400 is PERFECT!
Thank you SO much for your help!!
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
« Next Oldest · Web Site Functionality · Next Newest »
 

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Standard · Switch to: Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic · Subscribe to this forum

- Lo-Fi Version Time is now: 26th April 2024 - 01:57 AM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC