The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> Tumblr image appearing too small (with code)
harryknowles
post Jun 18 2012, 11:17 PM
Post #1





Group: Members
Posts: 2
Joined: 18-June 12
Member No.: 17,286
I'm trying to post an image to Tumblr and it's showing up too small. Original size: 500 x 1539 (72 dpi)
It's almost as if the "maximum height" has been reached and it's downsizing the width.

Thanks,


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" xml:lang="en" lang="en">

<head>

<!--



Serifs & Scribbles Tumlbr Theme by Ahhfred - ahhfred.com



-->


<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

<title>{Title}</title>
<link rel="stylesheet" href="css/scribbles.css" type="text/css" media="screen" charset="utf-8" />
<style type="text/css" media="screen">

/*** CSS RESET ***/
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}

/* remember to define focus styles! */
:focus {
outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}

/**** Start Style Sheet ****/





body {
font-family: 'OFL Sorts Mill Goudy TT', arial, serif;
font-style: normal;
color: #4d4b4b;
background: url('http://static.tumblr.com/yesdllz/99Xlcmmhp/bgtile.png') #eeeaed;
}


.dropshadow {
display: block;
height: 30px;
background: url('http://static.tumblr.com/yesdllz/PF2lcmmxr/dropshadow.png') bottom left no-repeat;
margin-left: 5px;
}

.dropshadowbottom {
display: block;
height: 33px;
margin-top: -4px;
margin-left: 5px;
background: url("http://static.tumblr.com/yesdllz/Ttulcmmia/dropshadowbottom.png") bottom left no-repeat;
}


.container {
margin-top: 5px;
margin-left: 15px;
width: 1050px;
clear: both;
}

.innercontainer {
background: url('http://static.tumblr.com/yesdllz/YA2lcmmjy/scribble2.jpg') top right no-repeat #fff;
padding: 20px;
padding-bottom: 0px;
width: 1010px;
border: 3px solid #e1dbdb;
}

h2.search {
font-size: 40px;
margin: 0px;
padding: 0px;
margin-bottom: 15px;
}

span.nosearchresults {
font-family: 'Reenie Beanie', arial, serif;
font-size: 130px;
margin: 0px;
padding: 0px;
margin-bottom: 15px;
}

.sidebar {
float: left;
width: 200px;
background: url('http://static.tumblr.com/yesdllz/QENlcmmke/sidebarsideline.jpg') 100% 20% no-repeat;
height: 1600px;
padding: 20px;
padding-top: 0px;
font-size: 13px;
}

.sidebar a {
color: #4d4b4b;

}

.sidebar a:hover {
color: #4d4b4b;
}

.content {
font-style: normal;
float: left;
width: 700px;
padding: 10px;
margin-top: 25px;
background: #fff;
}

.content p {
font-family: 'OFL Sorts Mill Goudy TT', georgia, arial, serif;
font-size: 13px;
font-style: normal;
font-weight: normal;
text-transform: normal;
letter-spacing: normal;
line-height: 1.4em;
}


.sidebar .title {
font-size: 25px;
color: #757575;
margin: 0px 0px 20px 0px;
}

.sidebar .title a {
text-decoration: none;
color: #757575;
}

.sidebar .portrait {
margin-left: 30px;
height: 130px;
width: 128px;
display: block;
background: url('{PortraitURL-96}') 45% 38% no-repeat;
}

.sidebar hr {
background: url('http://static.tumblr.com/yesdllz/7rulcmmll/sidebarlinebreak.jpg') 40% 50% no-repeat;
display: block;
height: 30px;
padding: 0px;
margin: 0px;
border: none;
}

.sidebar p {
font-size: 12px;
color: #2f2f2f;
}

.sidebar a.portraitlink {
display: block;
width: 128px;
background: url('http://static.tumblr.com/yesdllz/1Zhlcmmmf/portrait.png') 0px 0px no-repeat;
height: 155px;
}



.sidebar ul.pages {
font-size: 15px;
list-style-type: none;
margin-left: 20px;
padding: 0px;
}

.sidebar ul.pages li {
list-style-type: none;
background: url('http://static.tumblr.com/yesdllz/MiQlcmmmz/buttons.png') 0% 0% no-repeat;
height: 50px;
width: 200px;
}


.sidebar ul.pages li:hover {
background: url('http://static.tumblr.com/yesdllz/MiQlcmmmz/buttons.png') 0% 100% no-repeat;
}
.sidebar ul.pages li a {
text-decoration: none;
color: #2f2f2f;
width: 100px;
display: block;
padding: 18px 10px 15px 20px;
}
.sidebar ul.sublinks {
color: #2f2f2f;
margin-left: 20px;
}

.sidebar ul.sublinks li a {
color: #737070;
text-decoration: none;
font-size: 12px;
}

.sidebar ul.sublinks li a:hover {
color: #333;
}
.sidebar ul.sublinks li.archive {
background: url('http://static.tumblr.com/yesdllz/xCTlcmmnm/archive.jpg') 0% 20% no-repeat;
padding: 10px 0px 10px 35px;
}

.sidebar ul.sublinks li.subscribe {
background: url('http://static.tumblr.com/yesdllz/Fyylcmmo1/rss.jpg') 0% 20% no-repeat;
padding: 10px 0px 10px 35px;
}

form.searchbar {
margin: 10px 0px 0px 10px;
display: block;
width: 200px;
background: url('http://static.tumblr.com/yesdllz/zDxlcmmop/search.jpg') -10% 10% no-repeat;
}

form.searchbar input {
background: none;
height: 19px;
width: 89px;
margin: 11px 0px 0 7px;
border: none;
padding-left: 5px;
}

form.searchbar input.submit {
font-size: 1px;
border: none;
width: 30px;
height: 30px;
display: inline block;
margin: 0px;
padding: 0px;
cursor: pointer;
}

.post {
background: url('http://static.tumblr.com/yesdllz/IHIlctphj/boxxxl.jpg') bottom;
width: 623px;
padding: 14px 47px 49px 33px;
margin-top: -2px;
margin-bottom: 0px;
}

p {
margin-top: 5px;
}

p a {
color: #4d4b4b;
}

p a:hover {
color: #222;
}
.post h2 {
font-size: 30px;
margin: 0px;
padding: 0px;
margin-bottom: 15px;
}
.toppoststyle {
background: url('http://static.tumblr.com/yesdllz/EyNlcmmpl/boxtop.png') bottom no-repeat;
height: 8px;
}
.postcontainer {
padding-left: 57px;
width: 695px;
}

.textpost {
background: url('http://static.tumblr.com/yesdllz/deFlcmmq5/text.jpg') -12px 10px no-repeat;
}


.photopost {
background: url('http://static.tumblr.com/yesdllz/3Jnlcmmqh/photo.jpg') -9px 10px no-repeat;
}

.chatpost {
background: url('http://static.tumblr.com/yesdllz/eLTlcmmqs/chat.jpg') -4px 10px no-repeat;
}

.linkpost {
background: url('http://static.tumblr.com/yesdllz/UFJlcmmr4/link.jpg') -9px 10px no-repeat;
}

.quotepost {
background: url('http://static.tumblr.com/yesdllz/IQHlcmmrd/quote.jpg') -9px 10px no-repeat;
}

.videopost {
background: url('http://static.tumblr.com/yesdllz/VBTlcmmrr/video.jpg') -9px 10px no-repeat;
}

.musicpost {
background: url('http://static.tumblr.com/yesdllz/Zlylcmms8/music.jpg') -9px 10px no-repeat;
}

.questionpost {
background: url('http://static.tumblr.com/yesdllz/aeOlcmmsh/question.jpg') -9px 10px no-repeat;
}

/** Text Post **/

.textpost ul {
list-style: none;
margin: 1em 0 1em 15px;
padding: 0;
}

.textpost ul li {
line-height: 1.3em;
margin-top: 5px;
padding: 0 0 0 20px;
background: url('http://static.tumblr.com/yesdllz/6xZlcmmsu/bullet.png') no-repeat 0 2px;
font-size: 13px;
}


/** Photo Post **/
.photopost img {
text-align: center;
border: 2px solid #ddd;
padding: 5px;
margin-left: 55px;
margin-bottom: 10px;
}

.photopost img a{
text-decoration:none;
border:none;
}

.photopost .photocaption {
color: #777;
}


/** Video Post **/
.videopost object, .videopost iframe {
text-align: center;
padding: 5px;
margin-left: 55px;
margin-bottom: 10px;
border: 2px solid #ddd;
padding: 5px;
}

.videopost .description {
color: #8c8686;
margin-top: 20px;
margin-left: 20px;
}

/** chat Post **/

.chatpost ul.chat {
list-style-type: none;
background: none;
}

.chatpost ul.chat li.even {
padding: 10px 0px 10px 30px;
margin: 10px 0px;
color: #8c8686;
background: url('http://static.tumblr.com/yesdllz/O8ylcmmt9/chatface.jpg') no-repeat 0 0px;
}

.chatpost ul.chat li span.name {
font-weight: bold;
}

/** Link Post **/

.linkpost h2.link a {
font-size: 25px;
text-decoration: none;
padding-left: 10px;
background: url('http://static.tumblr.com/yesdllz/4tQlcmmtn/bigunderline.png') no-repeat 0px 24px;
}

.linkpost .description {
color: #8c8686;
margin-top: 20px;
margin-left: 20px;
}


/** Quote Post **/

.quotepost .quote {
font-size: 24px;
}

.quotepost .description {
color: #8c8686;
margin-top: 20px;
margin-left: 20px;
}



/** Music Post **/


.musicpost p.description {
color: #8c8686;
margin-top: 20px;
margin-left: 20px;
}



/** question Post **/


.questionpost p.question {
font-weight: bold;
font-size: 18px;
}

.questionpost .answer {
font-size: 18px;
color: #666;
margin-top: 20px;
margin-left: 0px;
}

.answer img {
border: 1px solid #999;
padding: 1px;
float: left;
margin-right: 10px;
}

.questionpost .asker {
font-size: 14px;
color: #aaa;
}


.date {
font-family: 'Reenie Beanie', arial, serif;
font-size: 40px;
color: #4D4B4B;
padding: 2px 0px 2px 61px;
height: 28px;
margin: 0px 20px 25px -1px;
}

/** Post Extras and Notes **/

.postextras {
font-size: 12px;
margin-top: -27px;
padding-bottom: 40px;
margin-left: 70px;
}

.postextras ul.postextraslist {
opacity: .6;
margin: 0px;
padding: 0px;
display: inline;
}

.postextras ul.postextraslist li {
float: left;
background: none;
padding: 0px;
margin: 0px;
margin-right: 10px;
}

.postextras ul.postextraslist li a {
text-decoration: none;
color: #737070;
}

.postextras ul.postextraslist li a:hover {
color: #222;
}

.postextras ul.postextraslist li.notes {
padding: 10px 0px 10px 30px;
background: url('http://static.tumblr.com/yesdllz/AuXlcmmuh/paperclip.jpg') no-repeat 0 -3px;
}

.postextras ul.postextraslist li.tags {
padding: 10px 0px 10px 20px;
background: url('http://static.tumblr.com/yesdllz/pJ7lcmmuq/tag.jpg') no-repeat -5px -3px;
}



.postextras ul.postextraslist li.twitter {
padding: 10px 0px 10px 38px;
background: url('http://static.tumblr.com/yesdllz/m33lcmmv1/twitter.jpg') no-repeat -5% 25%;
}

.postextras ul.postextraslist li.facebook {
padding: 10px 0px 2px 22px;
background: url('http://static.tumblr.com/yesdllz/BPYlcmmvf/facebook.jpg') no-repeat -5% 16%;
}

li.facebook iframe {
margin-top: -5px;
}

li.facebook iframe span.liketext {
font-size: 12px !important;
font-family: 'OFL Sorts Mill Goudy TT', arial, serif !important;
}

.postextras ul.postextraslist li.tags a {
margin-left: 5px;
}


.post a {
color: #4d4b4b;
}

.post a:hover {
color: #222;
}

.nextback {
clear: both;
margin-left: 500px;
}

a.next {
float: left;
display: block;
height: 80px;
width: 77px;
background: url('http://static.tumblr.com/yesdllz/d6vlcmmw2/next.png') no-repeat;
margin-left: 80px;
}

a.back {
float: left;
display: block;
height: 80px;
width: 77px;
background: url('http://static.tumblr.com/yesdllz/tgUlcmmwd/back.png') no-repeat;
}



.footer {
padding: 0px;
margin-top: -20px;
}

.clearme {
clear: both;
}

#disqus_thread {
font-family: "Georgia", serif;
margin-top: 0px;
width: 640px;
padding-left: 0px;
}

#disqus-content, #disqus-content p {
font-family: "Georgia", serif;
}

#disqus_thread a {
color: #4d4b4b;
}

#disqus_thread a:hover {
color: #222;
}
ol.notes a {
color: #4d4b4b;
}

ol.notes a:hover {
color: #222;
}
{CustomCSS}
</style>

<link href='http://fonts.googleapis.com/css?family=Reenie+Beanie&subset=latin' rel='stylesheet' type='text/css' />
<link href='http://fonts.googleapis.com/css?family=OFL+Sorts+Mill+Goudy+TT:regular&subset=latin' rel='stylesheet' type='text/css' />

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


<!-- tumblr metas -->
<meta name="text:Disqus Shortname" content="" />
<meta name="if:Show Tweet This" content="0"/>
<meta name="if:Show Facebook Like" content="0"/>
<meta name="if:Show Portrait" content="0"/>



<script type="text/javascript" charset="utf-8" src="http://bit.ly/javascript-api.js?version=latest&login=tweettrackjs&apiKey=R_7e9987b2fd13d7e4e881f9cbb168f523"></script>
<script type="text/javascript" charset="utf-8" src="http://s.bit.ly/TweetAndTrack.js?v=1.01"></script>

</head>

<body>
<div class="container">

<div class="dropshadow">
</div>

<div class="innercontainer">

<div class="sidebar">
<p class="title">
<a href=><img src=<a href= target=""><img src="http://i46.tinypic.com/2jg8qom.gif" border="0"</a></a>
</p>
{block:IfShowPortrait}
<div class="portrait">
<a href="/" class="portraitlink"></a>
</div>
{/block:IfShowPortrait}

{block:Description}
<hr />
{Description}

{block:AskEnabled}
<br />
<a href="/ask">{AskLabel}</a>
{/block:AskEnabled}
{/block:Description}




{block:HasPages}
<hr />
<ul class="pages">
{block:Pages}
<li><a href="{URL}" class="button">{Label}</a></li>
{/block:Pages}
</ul>
{/block:HasPages}


<hr />

<ul class="sublinks">
<li class="archive"><a href="/archive" >Archive</a> </li>
<li class="subscribe"><a href="{RSS}" >Subscribe</a> </li>
</ul>
<form class="searchbar" action="/search" method="get">
<input type="text" name="q" value="{SearchQuery}"/>
<input class="submit" type="submit" value="Search"/>
</form>
<br />
<p><a href="http://www.tumblr.com/theme/20935">Tumblr theme</a> by <a href="http://notes.ahhfred.com">ahhfred</a></p>
</div>

<div class="content">
{block:SearchPage}
<h2 class="search">
{block:NoSearchResults}
<span class="nosearchresults">Nothing! <br /></span>
{/block:NoSearchResults}
{SearchResultCount}
results for your search: {SearchQuery}
</h2>
{/block:SearchPage}


{block:Posts}
{block:NewDayDate}
{block:Date}
<div class="date">{Month} {DayOfMonth}{DayOfMonthSuffix}, {Year}</div>
{/block:Date}
{/block:NewDayDate}


{block:Text}
<div class="postcontainer textpost">
<div class="toppoststyle"></div>
<div class="post text">

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

{block:Photo}
<div class="postcontainer photopost">
<div class="toppoststyle"></div>
<div class="post">
{LinkOpenTag}
<img src="{PhotoURL-500}" alt="{PhotoAlt}"/>
{LinkCloseTag}
{block:Caption}
<div class="photocaption">{Caption}</div>
{/block:Caption}
</div>
</div>
{/block:Photo}

{block:Photoset}
<div class="postcontainer photopost">
<div class="toppoststyle"></div>
<div class="post">
{Photoset-500}

{block:Caption}
<div class="photocaption">{Caption}</div>
{/block:Caption}
</div>
</div>
{/block:Photoset}

{block:Chat}
<div class="postcontainer chatpost">
<div class="toppoststyle"></div>
<div class="post">
{block:Title}
<h2><a href="{Permalink}">{Title}</a></h2>
{/block:Title}

<ul class="chat">
{block:Lines}
<li class="{Alt} user_{UserNumber}">
{block:Label}
<span class="name">{Label}</span>
{/block:Label}
<span class="message">{Line}</span>
</li>
{/block:Lines}
</ul>
</div>
</div>
{/block:Chat}

{block:Link}
<div class="postcontainer linkpost">
<div class="toppoststyle"></div>
<div class="post">
<h2 class="link"><a href="{URL}" {Target}>{Name}</a> </h2>
{block:Description}
<div class="description">{Description}</div>
{/block:Description}
</div>
</div>
{/block:Link}

{block:Quote}
<div class="postcontainer quotepost">
<div class="toppoststyle"></div>
<div class="post">
<div class="quote {Length}">{Quote}</div>
{block:Source}
<div class="description">{Source}</div>
{/block:Source}
</div>
</div>
{/block:Quote}

{block:Answer}
<div class="postcontainer questionpost">
<div class="toppoststyle"></div>
<div class="post">
<p class="question">{Question} <br /><span class="asker">Asketh - {Asker}</span></p>

<div class="answer">
<img src="{PortraitURL-24}" class="answerportrait" />
{Answer}
</div>

</div>
</div>
{/block:Answer}

{block:Audio}
<div class="postcontainer musicpost">
<div class="toppoststyle"></div>
<div class="post">
{AudioPlayerGrey}

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

{block:Video}
<div class="postcontainer videopost">
<div class="toppoststyle"></div>
<div class="post">
{Video-500}

{block:Caption}
<div class="description">{Caption}</div>
{/block:Caption}
</div>
</div>
{/block:Video}

<div class="postextras">
<ul class="postextraslist">
{block:Date}
{block:IfDisqusShortname}
<li class="notes"><a href="{Permalink}#disqus_thread" class="vialink"></a></span></li>
{/block:IfDisqusShortname}

{block:IfNotDisqusShortname}
<li class="notes"><a href="{Permalink}">{NoteCountWithLabel}</a></li>
{/block:IfNotDisqusShortname}

{block:IfShowTweetThis}
<li class="twitter">
<a href="#" onclick="return TweetAndTrack.open(this, '{Permalink}');"><span style="display:none;">{block:PostSummary}{PostSummary}{/block:PostSummary}</span>Tweet</a>
</li>
{/block:IfShowTweetThis}

{block:IfShowFacebookLike}
<li class="facebook">
<iframe src="http://www.facebook.com/plugins/like.php?href={URLEncodedPermalink}&amp;layout=standard&amp;show_faces=false&amp;width=70&amp;action=like&amp;font=lucida+grande&amp;colorscheme=dark&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:52px; height:30px;" allowTransparency="true"></iframe>
</li>
{/block:IfShowFacebookLike}
{/block:Date}


{block:HasTags}
<li class="tags">
{block:Tags}
<a href="{TagURL}">{Tag}</a>
{/block:Tags}
</li>
{/block:HasTags}
</ul>


<div class="clearme"></div>
{block:PermalinkPage}
{block:IfDisqusShortname}
<div class="separator secondary"></div>
<div id="disqus_thread" class="content"></div>
<script type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/embed.js"></script><noscript><a href="http://{text:Disqus Shortname}.disqus.com/?url=ref">{lang:View the discussion thread}</a></noscript>
{/block:IfDisqusShortname}
{/block:PermalinkPage}

{block:PostNotes}
{PostNotes}
{/block:PostNotes}
</div>
{/block:Posts}
</div>
<div class="clearme"></div>

</div>
<div class="dropshadowbottom"></div>

<div class="footer">&nbsp;
{block:PermalinkPagination}
<div class="nextback">
{block:PreviousPost}
<a class="back" href="{PreviousPost}"></a>
{/block:PreviousPost}

{block:NextPost}
<a class="next" href="{NextPost}"></a>
{/block:NextPost}
</div>
{/block:PermalinkPagination}



{block:Pagination}
<div class="nextback">
{block:PreviousPage}
<a class="back" href="{PreviousPage}"></a>
{/block:PreviousPage}

{block:NextPage}
<a class="next" href="{NextPage}"></a>
{/block:NextPage}
</div>
{/block:Pagination}
<div class="clearme"></div>
</div>
</div>


{block:IfShowTweetThis}
<script type="text/javascript" charset="utf-8" src="http://bit.ly/javascript-api.js?version=latest&login=tweettrackjs&apiKey=R_7e9987b2fd13d7e4e881f9cbb168f523"></script>
<script type="text/javascript" charset="utf-8" src="http://s.bit.ly/TweetAndTrack.js?v=1.01"></script>
{/block:IfShowTweetThis}



{block:IfDisqusShortname}
<script type="text/javascript">
//<![CDATA[
(function() {
var links = document.getElementsByTagName('a');
var query = '?';
for(var i = 0; i < links.length; i++) {
if(links[i].href.indexOf('#disqus_thread') >= 0) {
query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
}
}
document.write('<span><script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>');
})();
//]]>
</script>
{/block:IfDisqusShortname}

</body>
</html>
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic
harryknowles   Tumblr image appearing too small (with code)   Jun 18 2012, 11:17 PM
pandy   We've learnt that only a small range of image ...   Jun 18 2012, 11:52 PM
harryknowles   Ok thanks, but it's almost as if my previous i...   Jun 18 2012, 11:59 PM
pandy   Sorry, don't know anything about Tumblr's ...   Jun 19 2012, 09:50 AM

« 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: Switch to: Standard · Switch to: Linear+ · Outline

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

- Lo-Fi Version Time is now: 27th April 2024 - 03:51 PM
Invision Power Board © 2024  IPS, Inc.
Licensed to: HTMLHelp.com, LLC