Tumblr: photo max width |
Tumblr: photo max width |
etcetera01 |
Oct 26 2011, 01:48 AM
Post
#1
|
Group: Members Posts: 1 Joined: 26-October 11 Member No.: 15,717 |
Help! How do i change the max width of my photos to fit in the posts?
<!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> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>(1) Facebook</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} --> <meta name="color:Background" content="#d0ddd7" /> <meta name="color:Links" content="#666666" /> <meta name="image:Background" content="http://static.tumblr.com/jw8fmba/JrJlm0bpc/bg.jpg" /> <meta name="image:Custom logo" content="" /> <meta name="if:Repeat background" content="0" /> <meta name="if:Show description" content="0" /> <meta name="color:Links hover" content="#663333" /> <meta name="if:Infinite scrolling" content="0" /> <meta name="font:Body" content="Georgia" /> <meta name="if:Like button on posts" content="0" /> <meta name="if:Display footer" content="1" /> <meta name="text:Title font size" content="60px" /> <style type="text/css"> @import url(http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz:bold); body { margin:0; background:url({image:Background}) {block:IfNotRepeatBackground}no-repeat{/block:IfNotRepeatBackground} {color:Background}; } a:link,a:visited { text-decoration:none; color:{color:Links}; } a:hover,a:active { color:{color:Links Hover}; } a img { border:0; } p,li,code,blockquote { font-size:11px; line-height:16px; font-family: {font:Body}; } blockquote { border-left:5px #CCC solid; margin-left:10px; padding-left:10px; } h1 { font-family: Helvetica, Arial, sans-serif; } div.pagination { width: 100%; height:100px; position: fixed; bottom: 25%; } div.pagination div#next { float:right; margin:0 10px; background:url(http://static.tumblr.com/jw8fmba/S0clac1sk/next.png); height:100px; width:100px; } div.pagination div#previous { float:left; margin:0 10px; background:url(http://static.tumblr.com/jw8fmba/PKFlac1sy/previous.png); height:100px; width:100px; } .wrap { margin:106px 0 30px 240px; width:800px; position:relative; } #title_holder { width:300px; position:relative; } #title_holder img { max-width:300px; float:right; } #title { background:#FFF; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; padding:15px 30px; float:right; position:relative; -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 10px; } #title h1 { font-size: {text:Title font size}; text-transform:uppercase; text-align:right; font-family: "Yanone Kaffeesatz", "Lucida Grande", Lucida, Verdana, sans-serif; margin: 0; } #title a h1 { text-decoration:none; color:{color:Background}; } #title #arrow { position:absolute; background:url(http://static.tumblr.com/jw8fmba/p2ilhd72v/title_arrow.png) no-repeat; width:31px; height:22px; bottom:-22px; right:60px; } #posts { width:600px; position:relative; float: left; z-index: 5; } #posts a:link { text-decoration:underline; } #sidebar { width: 160px; float: right; position: relative; } #sidebar #links { position: absolute; top: 0; right: -37px; width: 27px; } #sidebar #links .link { width:27px; height:28px; background-repeat:no-repeat; margin: 0 0 2px 0; } #sidebar #links .page { display: none; } #post { width:600px; position:relative; float: left; } #post #content { background:#FFF; width:600px; float:left; -webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 10px; -webkit-border-bottom-right-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-bottomright: 5px; -moz-border-radius-bottomleft: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; position:relative; margin-bottom:30px; z-index: 5; } #post #content h1 { font-size: 30px; font-family: "Yanone Kaffeesatz", "Lucida Grande", Lucida, Verdana, sans-serif; margin-top: 10px; font-weight: normal; } #post #question { margin: 0 10px 10px 10px; padding: 10px; font-size: 12px; line-height: 16px; background: #e7eaec; -moz-border-radius: 5px; -webkit-border-radius: 5px; position: relative;} #post #arrow { background: url(http://static.tumblr.com/jw8fmba/HOullykum/arrow.png) no-repeat; width: 13px; height: 7px; position: absolute; left: 10px; bottom: -7px; } #post #asker { width: 100%; font-size: 11px;} #post #asker img { width: 16px; margin: 0 5px -4px 20px; } #post #asker a { text-decoration:none;} #post #body img { max-width: 100%; height:auto;} #post #content #img_holder { width: 400px; min-height: 35px; background: url(http://static.tumblr.com/jw8fmba/rnTllljm5/loading.gif) center no-repeat; } #post #content img { max-width: 100%; } #post #content #body { padding:10px 20px; } #post #info a { text-decoration: none; color: #FFF; } #post #info { width: 100px; position: absolute; top: 0; left: 300px; -webkit-transition: all .4s ease-out; -moz-transition: all .4s ease-out; -o-transition: all .4s ease-out; transition: all .4s ease-out; opacity: 0; } #post:hover #info { left:600px; -webkit-transition: all .4s ease-out; -o-transition: all .4s ease-out; transition: all .4s ease-out; opacity: 1; } #post #info #details { float:left; display: block; margin-bottom: 5px; font-family: "Yanone Kaffeesatz", "Lucida Grande", Lucida, Verdana, sans-serif; text-transform: uppercase; font-weight: normal; overflow: hidden; } .tags { padding: 5px 10px 5px 15px; font-size: 11px; background: {color:Links Hover}; } .notecount { padding: 5px 10px 5px 32px; font-size: 14px; background: url(http://static.tumblr.com/jw8fmba/qu0lm0b3n/heart.png) no-repeat 15px 7px {color:Links Hover}; } .playcount { padding: 5px 10px 5px 30px; font-size: 14px; background: url(http://static.tumblr.com/jw8fmba/xzflm0dwb/plays.png) no-repeat 15px 7px {color:Links Hover}; } .asklink { padding: 5px 10px 5px 15px; font-size: 14px; background: {color:Links Hover}; } .date { font-size: 30px; line-height: 25px; padding: 10px 15px 5px 15px; background: {color:Links Hover}; } .January,.February,.October,.November,.December { font-size: 10px; } .March,.August { font-size: 12px; } .April { font-size: 14px; } .May { font-size: 18px; } .June,.July { font-size: 17px; } .September { font-size: 9px; } .source { font-size: 12px; padding: 5px 10px 5px 15px; background: {color:Links Hover}; } .facebooklike { padding: 5px 10px 5px 15px; background: #eceef5; } #shadow { background:url(http://static.tumblr.com/jw8fmba/syClhd72e/shadow.png) no-repeat; width:600px; height:15px; position:absolute; bottom:-15px; left:0px; opacity: 0.5; } #credit { text-align:center; margin-top:600px; } div#note { width:600px; position: relative; float: left; } .notes p {margin-top:0;} ol.notes { padding: 0px; margin: 10px 0px; list-style-type: none; color:#333; } ol.notes li.note { background: #FFF; margin: 4px 0; padding: 8px; -moz-border-radius: 3px; -webkit-border-radius: 3px; } ol.notes li.note img.avatar { vertical-align: -4px; margin-right: 10px; width: 16px; height: 16px; } ol.notes li.note span.action { font-weight: normal; } ol.notes li.note .answer_content { font-weight: normal; } ol.notes li.note blockquote { border-color: #FFF; padding: 4px 10px; margin: 10px 0px 0px 15px; } ol.notes li.note blockquote a { color:#333; text-decoration: none; } .label { font-weight:bold; } #bottom_menu { width: 100%; padding: 30px 0 20px 0; text-align: center; position: absolute; position: fixed; bottom: 0; left: 0; z-index: 6; background: url(http://static.tumblr.com/jw8fmba/MMMlmnvfu/bottom_menu.png) repeat-x; text-shadow: 0px 1px 0px #000000; filter: dropshadow(color=#000000, offx=0, offy=1); font-family: Helvetica, Arial, sans-serif; font-size: 12px; opacity: 0; -webkit-transition: all .4s ease-out; -moz-transition: all .4s ease-out; -o-transition: all .4s ease-out; transition: all .4s ease-out; } #bottom_menu:hover { opacity: 1; -webkit-transition: all .4s ease-out; -moz-transition: all .4s ease-out; -o-transition: all .4s ease-out; transition: all .4s ease-out; } #bottom_menu a:link,#bottom_menu a:hover,#bottom_menu a:active,#bottom_menu a:visited { color: #FFF; } #bottom_menu span { margin: 0 3px; color: #FFF; } {CustomCSS} </style> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js?ver=3.1.1'></script> <script>$(document).ready(function(){ $(".scroll").click(function(event){ event.preventDefault(); var full_url = this.href; var parts = full_url.split("#"); var trgt = parts[1]; var target_offset = $("#"+trgt).offset(); var target_top = target_offset.top; $('html, body').animate({scrollTop:target_top}, 500); }); });</script> <!-- {block:IfInfiniteScrolling} --> <script type="text/javascript" src="http://static.tumblr.com/q0etgkr/J5bl3lkz1/tumblrautopagernopage.js"></script> <!-- {/block:IfInfiniteScrolling} --> <script type="text/javascript" src="http://o.aolcdn.com/os_merge/?file=/streampad/sp-player.js&file=/streampad/sp-player-tumblr.js&expsec=86400&ver=11&bgcolor=#ffffff&trackcolor=#474747&clicktext=dumdumdumm..dont%20click%20this...&drawersize=200"></script> </head> <body> <!-- {block:IfNotInfiniteScrolling} --> <!--{block:Pagination}--> <div class="pagination"> <!--{block:PreviousPage}--> <a href="{PreviousPage}"><div id="previous"></div></a> <!--{/block:PreviousPage}--> <!--{block:NextPage}--> <a href="{NextPage}"><div id="next"></div></a> <!--{/block:NextPage}--> </div> <!--{/block:Pagination}--> <!-- {/block:IfNotInfiniteScrolling} --> <!-- {block:IfDisplayFooter} --> <div id="bottom_menu"> <a href="#tumblr_controls" class="scroll">Top ?</a> <span>|</span> <a href="/archive">Archive</a><!-- {block:AskEnabled} --> <span>|</span> <a href="/ask">{AskLabel}</a><!-- {/block:AskEnabled} --><!-- {block:SubmitEnabled} --> <span>|</span> <a href="/submit">{SubmitLabel}</a><!-- {/block:SubmitEnabled} --><!-- {block:HasPages} --><!-- {block:Pages} --> <span>|</span> <a href="{URL}">{Label}</a><!-- {/block:Pages} --><!-- {/block:HasPages} --> </div> <!-- {/block:IfDisplayFooter} --> <div class="wrap"> <div id="posts"> <!-- {block:IfInfiniteScrolling} --><div class="autopagerize_page_element"><!-- {/block:IfInfiniteScrolling} --> <!-- {block:Posts} --> <!-- {block:Photo} --> <div id="post"> <div id="content"> <div id="img_holder"> {LinkOpenTag} <img src="{PhotoURL-500}" alt="{PhotoAlt}" /> {LinkCloseTag} </div> <!-- {block:Caption} --> <div id="body">{Caption}</div> <!-- {/block:Caption} --> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Photo} --> <!-- {block:Audio} --> <div id="post"> <div id="content"> <!-- {block:AlbumArt} --> <img src="{AlbumArtURL}" /> <!-- {block:AlbumArt} --> <!-- {block:Caption} --> <div id="body"> {AudioPlayerWhite} {Caption}</div> <!-- {/block:Caption} --> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <a href="{Permalink}" title="This audio has been played {FormattedPlayCount} times"><div id="details" class="playcount">{FormattedPlayCount}</div></a> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}" title="This post is from {SourceTitle}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Audio} --> <!-- {block:Video} --> <div id="post"> <div id="content"> {Video-400} <!-- {block:Caption} --> <div id="body">{Caption}</div> <!-- {/block:Caption} --> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Video} --> <!-- {block:Photoset} --> <div id="post"> <div id="content"> {Photoset-500} <!-- {block:Caption} --> <div id="body">{Caption}</div> <!-- {/block:Caption} --> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Photoset} --> <!-- {block:Text} --> <div id="post"> <div id="content"> <div id="body"> <!-- {block:Title} --> <h1>{Title}</h1> <!-- {/block:Title} --> {Body} </div> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Text} --> <!-- {block:Quote} --> <div id="post"> <div id="content"> <div id="body"> <h1>"{Quote}"</h1> <!-- {block:Source} --><p>- {Source}</p> <!-- {/block:Source} --> </div> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Quote} --> <!-- {block:Link} --> <div id="post"> <div id="content"> <div id="body"> <h1><a href="{URL}" {Target}>{Name}</a></h1> <!-- {block:Description} --> {Description} <!-- {/block:Description} --> </div> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Link} --> <!-- {block:Chat} --> <div id="post"> <div id="content"> <div id="body"> <!-- {block:Title} --> <h1>{Title}</h1> <!-- {/block:Title} --> <!-- {block:Lines} --> <!-- {block:Label} --><p><em>{Label}</em> <!-- {/block:Label} -->{Line}</p> <!-- {/block:Lines} --> </div> <div id="shadow"></div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <!-- {block:HasTags} --> <!-- {block:Tags} --> <a href="{TagURL}" title="View more posts tagged with {Tag}"><div id="details" class="tags">{Tag}</div></a> <!-- {/block:Tags} --> <!-- {/block:HasTags} --> <!-- {block:ContentSource} --> <a href="{SourceURL}"> <div id="details" class="source"> <!-- {block:SourceLogo} --> <img src="{WhiteLogoURL}" width="{LogoWidth}" height="{LogoHeight}" alt="{SourceTitle}" /> <!-- {/block:SourceLogo} --> <!-- {block:NoSourceLogo} --> Via: {SourceTitle} <!-- {/block:NoSourceLogo} --> </div> </a> <!-- {/block:ContentSource} --> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!-- {/block:Chat} --> <!--{block:Answer}--> <div id="post"> <div id="content" style="padding-top: 10px"> <div id="question">{Question}<div id="arrow"></div></div> <div id="asker"><img src="{AskerPortraitURL-16}" /> {Asker}</div> <div id="body">{Answer}</div> </div> <!-- {block:Date} --> <div id="info"> <a href="{Permalink}" title="This post was published on {DayOfWeek}, {DayOfMonth} of {Month} at {12Hour}:{Minutes}{AmPm}"><div id="details" class="date">{DayOfMonthWithZero}<br /><span class="{Month}">{Month}</span></div></a> <!-- {block:NoteCount} --> <a href="{Permalink}#notes" title="Reblog or like this post"><div id="details" class="notecount">{NoteCount}</div></a> <!-- {/block:NoteCount} --> <a href="/ask" title="{AskLabel}"><div id="details" class="asklink">{AskLabel}</div></a> <!-- {block:IfLikeButtonOnPosts} --> <div id="details" class="facebooklike"> <iframe src="http://www.facebook.com/plugins/like.php?app_id=222806471081411&href={URLEncodedPermalink}&send=false&layout=button_count&width=50&show_faces=false&action=like&colorscheme=light&font&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:50px; height:21px;" allowTransparency="true"></iframe> </div> <!-- {/block:IfLikeButtonOnPosts} --> </div> <!-- {/block:Date} --> </div> <!--{block:Answer}--> <!--{block:PermalinkPage}--> <!--{block:PostNotes}--> <div id="note">{PostNotes}</div> <!--{/block:PostNotes}--> <!--{/block:PermalinkPage}--> <!-- {/block:Posts} --> <!-- {block:IfInfiniteScrolling} --></div><!-- {/block:IfInfiniteScrolling} --> </div> <div id="sidebar"> <div id="title_holder"> <!-- {block:IfNotCustomLogoImage} --> <div id="title"> <a href="/"><h1>{Title}</h1></a> <!-- {block:IfShowDescription} --> <p>{Description}</p> <!-- {/block:IfShowDescription} --> <div id="arrow"></div> </div> <!-- {/block:IfNotCustomLogoImage} --> <!-- {block:IfCustomLogoImage} --> <a href="/"><img src="{image:Custom Logo}" /></a> <!-- {/block:IfCustomLogoImage} --> </div> <div id="credit"> <li>{block:SubmissionsEnabled}<a href="/submit">Submit</a>{/block:SubmissionsEnabled}</li> <li>{block:AskEnabled}<a href="/ask">Ask</a>{/block:AskEnabled}</li> <li><a href="/archive">Archive</a></li> <li><a href="{RSS}">RSS</a></li> <li> <form action="/search" method="get" id="search"> <input type="text" name="q" value="SEARCH" onfocus="value='{searchQuery}'" onblur="value='SEARCH'"/> <input type="hidden" value="Search" /> </form></li> <li><a href="https://twitter.com/yyrraa">Twitter</a></li> <li><a href="http://www.facebook.com/johayra.fabricante">Facebook</a> </li> <li><a href="http://letmeplaythemusic.blogspot.com/">Music blog</a></li> <li><a href="https://plus.google.com/109539557496504899406/plusones?hl=en">Google+ </a></li> </center><br> <script type="text/javascript" src="http://www.usuarios-online.com/usuarios.php?v=http://theculturesnob.tumblr.com/"></script> human beings online </div> <div id="links"> <!-- {block:AskEnabled} --> <!-- {/block:AskEnabled} --> <!-- {block:SubmitEnabled} --> <!-- {/block:SubmitEnabled} --> <!-- <a href="/mobile" title="View Mobile Layout"> <div class="link mobile"></div> </a> --> <!-- {block:Twitter} --> </a> <!-- {/block:Twitter} --> <!-- {block:HasPages} --> <!-- {block:Pages} --> <a href="{URL}"> <div class="link {Label} page"></div> </a> <!-- {/block:Pages} --> <!-- {/block:HasPages} --> </div> </div> </div> </body> </html> http://slobandsexy.tumblr.com/-- my site |
Darin McGrew |
Oct 26 2011, 02:25 AM
Post
#2
|
WDG Member Group: Root Admin Posts: 8,365 Joined: 4-August 06 From: Mountain View, CA Member No.: 3 |
So, what width do you think will "fit in the posts"? Your images are specified as 500px wide in the Tumblr code:
QUOTE <img src="{PhotoURL-500}" alt="{PhotoAlt}" /> But they're specified as 400px wide in the CSS:QUOTE #post #content #img_holder { width: 400px; [...] } #post #content img { max-width: 100%; } |
sola |
Oct 26 2011, 03:00 AM
Post
#3
|
Group: Members Posts: 5 Joined: 25-October 11 Member No.: 15,715 |
So, what width do you think will "fit in the posts"? Your images are specified as 500px wide in the Tumblr code: QUOTE <img src="{PhotoURL-500}" alt="{PhotoAlt}" /> But they're specified as 400px wide in the CSS:QUOTE #post #content #img_holder { width: 400px; [...] } #post #content img { max-width: 100%; } regarding the css code and tumblr codes, when it comes to pictures you can use different numbers. Tumblr will downscale the image for you, but its best to use a number around the size of your images for resolution reasons, or it ends up kind of blurry on tumblr. What I would do is switch the 500 url to 400. other than that try including a height limit to your image settings too, since tumblrs default is usually "auto" (for me atleast) |
Lo-Fi Version | Time is now: 24th April 2024 - 05:04 PM |