Help - Search - Members - Calendar
Full Version: Problem stretching image
HTMLHelp Forums > Web Authoring > Web Site Functionality
webnoob1
Mar 15 2016, 11:57 AM
I'm trying to revamp my personal blog and I'm having trouble trying to get the images posted to resize automatically to fit the browser, to make it full screen in a sense. I'm terrible with HTML but I do have a real real basic knowledge of how it works.

Originally the image defaulted on the screen http://www.imeugene.com was repeated but somehow I got it to not do that but I don't know what part of the coding deals with the posted image. I tried reseting a few sizing to be 100% but to no work. Anyone got any ideas which part I have to mess up in the coding?


<!DOCTYPE html>
<html lang="{block:English}en{/block:English}{block:French}fr{/block:French}{block:German}de{/block:German}{block:Japanese}ja{/block:Japanese}{block:Italian}it{/block:Italian}{block:Spanish}es{/block:Spanish}{block:Polish}pl{/block:Polish}">
<head>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta name="viewport" content="width=device-width">
<meta charset="utf-8">

<!--

-->

<meta name='text:Disqus Shortname' content='' />
<meta name="text:Google Analytics ID" content="">

<!-- DEFAULT COLORS -->
<meta name="color:Title" content="#FFFFFF"/>
<meta name="color:Title Hover" content="#000000"/>
<meta name="color:Text Post" content="#2c333f"/>
<meta name="color:Quote Post" content="#ff6b46"/>
<meta name="color:Chat Post" content="#0ba5e6"/>
<meta name="color:Link Post" content="#1de7a2"/>
<meta name="color:Audio Post" content="#9575B2"/>

<!-- OPTIONS -->
<meta name="if:Infinite scrolling" content="0">
<meta name="if:Show description" content="1"/>
<meta name="if:Show captions on index" content="1"/>

<meta name="select:Photos" content="tile" title="Tile">
<meta name="select:Photos" content="fill" title="Fill screen">
<meta name="select:Photos" content="center" title="Center">

<title>{Title}{block:PostSummary} &mdash; {PostSummary}{/block:PostSummary}</title>
<meta name="description" content="{MetaDescription}">

<link rel="apple-touch-icon" href="{PortraitURL-128}">
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">

<link rel="stylesheet" href="http://static.tumblr.com/exomipi/lKfmmovhi/normalize.min.css">

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">


<style>


body, html {
width: 100%;
height: 100%;
font-family: "Helvetica Neue","HelveticaNeue",Helvetica,Arial;
background: black;
}

.posts {
width: 100%;
height: 100%;
position: relative;
}

.clear {
display: block;
width: 0;
height: 0;
font-size: 0;
line-height: 0;
clear: both;
float: none;
}

.container {
width: auto;
height: auto;
}

.post {
width: 100%;
height: auto;
margin: 0 auto;
position: relative;
background-color: {Color:Text Post};
}

.post-text {
background-color: {Color:Text Post};
}

.post.post-text {
height: auto;
min-height: 100%;
}

.post-quote {
background-color: {Color:Quote Post};
}

.post-link {
background-color: {Color:Link Post};
}

.post-chat {
background-color: {Color:Chat Post};
}

.post-audio,
.post-video {
background-color: {Color:Audio Post};
}

.post-photo,
.post-photoset {
background: #111 center center no-repeat fixed;
background-size: 32px;
}


.post-text + .post-text,
.post-quote + .post-quote,
.post-link + .post-link,
.post-chat + .post-chat,
.post-audio + .post-audio,
.post-video + .post-video {
border-top: 1px solid rgba(0,0,0,0.1);
}

.post-bg {
width: 100%;
height: auto;
min-height: 100vh;
background-position: center center;
background-repeat: no-repeat;
background-attachment: scroll;
background-size: cover;
display: box;
display: flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}

.photo > a,
.photoset > a,
.panorama > a {
display: block;
width: 100vw;
height: 100vh;
}

.post.post-photoset {
height: auto;
}


.title {
text-align: center;
height: auto;
padding: 30px 0;
font-weight: bold;
position: absolute;
width: 100%;
z-index: 100;
}

.title h1 {
color: {color:Title};
margin: 0;
font-size: 32px;
word-wrap: break-word;
}

.title a:hover {
color: {color:Title Hover};
}

.title.index-title h1 {
font-size: 56px;
}

.title h2 {
margin: 0 auto;
margin-top: 10px;
font-size: 20px;
font-weight: normal;
color: white;
}

.title.index-title h2 {
font-size: 24px;
}

.title a {
color: {color:Title};
text-decoration: none;
}

a {
color: #FFF;
text-decoration: underline;
}

#disqus_block a {
color: #0BA5E6;
}

.arrow-up {
margin: 0 auto;
width: 0;
height: 0;
border-left: 11px solid transparent;
border-right: 11px solid transparent;
border-bottom: 11px solid #000;
position: absolute;
left: 50%;
margin-left: -11px;
bottom: -1px;
}

.meta {
background: #000;
background: rgba(0,0,0,0.3);
color: white;
text-align: center;
font-size: 14px;
font-weight: bold;
position: absolute;
bottom: 10px;
left: 10px;
}

.meta:hover {
background: rgba(0,0,0,0.8);
}

.meta a {
text-decoration: none;
}

.meta ul {
margin: 0;
padding: 0;
}

.meta li {
display: block;
text-align: left;
padding: .5em 1em;
line-height: 2em;
}

.meta li.more-link {
padding: 0;
line-height: auto;
}

.meta li.more-link a {
display: block;
padding: 0;
font-size: 20px;
line-height: 29px;
width: 35px;
height: 35px;
text-align: center;
}

.caption {
font-size: 14px;
line-height: 1.5em;
font-weight: bold;
color: #FFF;
position: absolute;
bottom: 10px;
width: 100%;
display: inline-block;
text-align: center;
}

.caption p, .caption blockquote {
margin: 0;
}

.caption > span {
display: inline-block;
padding: .5em 1em;
background: rgba(0,0,0,0.5);
margin: 0 20%;
}

{block:IfNotShowCaptionsOnIndex}
.index-page .caption {
display: none;
}
{/block:IfNotShowCaptionsOnIndex}

nav {
background: #111;
color: #FFF;
font-size: 72px;
position: relative;
width: 100%;
}

.infinite-scrolling.index-page nav.pages-nav {
display: block;
}

nav a {
color: #ddd;
text-decoration: none;
text-align: center;
line-height: 1em;
padding: 0px 0 0.2em;
}


nav a:hover {
color: #fff;
background-color: #000;
}

.back, .forward {
float: left;
width: 50%;
}

.forward {
float: right;
}

/* ==========================================================================
Menu
========================================================================== */

.MenuStuff,
.MenuStuff ul {
display: none;
}

.Ask,
.Submit,
.Pages {
display: block !important;
}

#menu {
position: fixed;
z-index: 105;
top: 0;
left: 0;
-webkit-transform: translate(-100%, 0);
-webkit-transition: -webkit-transform 200ms ease-in-out;
-moz-transform: translate(-100%, 0);
-moz-transition: -moz-transform 200ms ease-in-out;
-o-transform: translate(-100%, 0);
-o-transition: -o-transform 200ms ease-in-out;
-ms-transform: translate(-100%, 0);
-ms-transition: -ms-transform 200ms ease-in-out;
transform: translate(-100%, 0);
transition: transform 200ms ease-in-out;
width: 300px;
height: 100%;
background: black;
color: white;
overflow: auto;
}

#menu ul + ul {
border-top: 1px solid rgba(255,255,255,0.2);
}

#menu h3 {
text-align: center;
font-size: 14px;
text-transform: uppercase;
letter-spacing: 2px;
line-height: 25px;
}

#menu ul {
text-align: center;
font-size: 14px;
line-height: 18px;
margin: 10px 20px;
padding: 0;
list-style: none;
}

#menu li {
margin: 15px 0;
}

#menu li a {
text-decoration: none;
border-bottom: 1px solid transparent;
-webkit-transition: border 200ms;
-moz-transition: border 200ms;
-o-transition: border 200ms;
transition: border 200ms;
}

#menu li a:hover {
text-decoration: none;
border-bottom: 1px solid white;
}

label[for=ShowMenu] {
border: 0;
background: rgba(0,0,0,0.3);
position: fixed;
z-index: 110;
top: 10px;
left: 10px;
text-align: center;
padding: 0;
margin: 0;
width: 35px;
height: 35px;
cursor: pointer;
}

label[for=ShowMenu]:hover {
background: black;
}

label[for=ShowMenu] span {
display: inline-block;
width: 16px;
height: 2px;
background: white;
position: relative;
top: 3px;
}

label[for=ShowMenu] span:before,
label[for=ShowMenu] span:after {
content: '';
position: absolute;
width: 16px;
height: 2px;
background: white;
-webkit-transition: opacity 200ms;
-moz-transition: opacity 200ms;
-o-transition: opacity 200ms;
-ms-transition: opacity 200ms;
transition: opacity 200ms;
}

label[for=ShowMenu] span:before {
top: -5px;
left: 0;
}

label[for=ShowMenu] span:after {
top: 5px;
left: 0;
}

#ShowMenu {
position: fixed;
left: -1000%;
top: 0;
}

#ShowMenu:checked ~ #menu {
-webkit-transform: translate(0%, 0);
-moz-transform: translate(0%, 0);
-o-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
transform: translate(0%, 0);
}

#ShowMenu:checked ~ label[for=ShowMenu] span:before,
#ShowMenu:checked ~ label[for=ShowMenu] span:after {
opacity: 0;
}

/* ==========================================================================
Text / Chat Posts
========================================================================== */

.text {
height: 100%;
}

.text-block {
font-size: 16px;
line-height: 1.5em;
width: 50%;
padding: 50px 0;
margin: auto;
min-width: 300px;
color: white;
}

.text-block a {
color: white;
position: relative;
}

.conversation {
margin: 0 auto;
padding: 40px 0;
width: 50%;
min-width: 300px;
position: relative;
margin: auto;
list-style: none;
}

.conversation li {
padding: 20px;
color: #FFF;
background: rgba(0,0,0,0.75);
}

.conversation li.odd {
background: rgba(255,255,255,0.75);
color: black;
}

.answer-avatar {
float: left;
margin: 0 20px 20px 0;
}


/* ==========================================================================
Link / Quote Posts
========================================================================== */


.link h3 {
margin: auto;
position: relative;
font-size: 24px;
text-align: center;
color: #FFF;
}

.link h3 a {
text-decoration: none;
text-indent: -30px;
}

.link h3 a:hover {
text-decoration: underline;
}

.quote, .link {
padding: 60px 0 70px;
}

.quote .quote-text {
text-align: center;
position: relative;
margin: auto;
padding: 0 20%;
}

.quote blockquote {
margin: 0;
font-size: 24px;
font-weight: bold;
color: white;
}

.quote .source,
.quote .source ~ p {
color: #FFF;
opacity: 0.75;
font-size: 16px;
font-weight: bold;
}

.quote .source a {
color: white;
text-decoration: underline;
}

/* ==========================================================================
Audio / Video Posts
========================================================================== */

.audio_player {
width: 100%;
margin: auto;
height: 100%;
}

.tumblr_audio_player {
width: 100%;
height: 100%;
position: relative;
margin: auto;
opacity: 0.9;
}

.audio.post-bg {
background-repeat: no-repeat;
background-size: stretch;
}

.audio.post-bg > span {
width: 100%;
height: 100%;
display: block;
display: box;
display: flexbox;
display: -webkit-flex;
display: flex;
-webkit-flex-flow: row wrap;
flex-flow: row wrap;
}

.video iframe {
display: block;
width: 100%;
height: 100%;
min-width: 300px;
margin: auto;
position: relative;
}

.video .spotify_audio_player,
.video .bandcamp_audio_player {
width: 300px;
height: auto;
position: relative;
}

/* ==========================================================================
Post Notes
========================================================================== */

.notes {
padding: 0;
margin: 0;
background: #222;
}

.notes li {
display: block;
padding: 10px;
text-align: center;
}

.notes li:nth-child(even) {
background: #111;
}

.notes li .avatar_frame {
display: inline-block;
vertical-align: middle;
padding-right: 10px;
}

.notes li .avatar_frame img {
width: 100%;
height: 100%;
}

.notes li .action {
color: #ccc;
}

.notes li .action a {
color: #fff;
text-decoration: none;
}

.notes li .action a:hover {
text-decoration: underline;
}

#disqus_block {
background:#f6f6f6;
padding: 30px 0;
}

#disqus_thread {
width: 50%;
margin: 0 auto;
min-width: 300px;
}


.Loading {
text-align: center;
display: none;
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 45px;
line-height: 45px;
background: #111;
color: #fafafa;
font-size: 1.3em;
-webkit-transform: translate(0, 100%);
-moz-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
-o-transform: translate(0, 100%);
transform: translate(0, 100%);

-webkit-transition: all 100ms;
-moz-transition: all 100ms;
-ms-transition: all 100ms;
-o-transition: all 100ms;
transition: all 100ms;
}

.infinite-scrolling .Loading {
display: block;
}

.infinite-scrolling.is-loading .Loading {
-webkit-transform: translate(0, 0);
-moz-transform: translate(0, 0);
-ms-transform: translate(0, 0);
-o-transform: translate(0, 0);
transform: translate(0, 0);
}

.Loading i {
display: inline-block;
-webkit-animation: fa-spin 0.6s infinite linear;
}

.infinite-scrolling.index-page.is-loading {
padding-bottom: 45px;
}

.infinite-scrolling.index-page nav.pages-nav {
position: absolute;
left: -100vw;
height: 1px;
overflow: hidden;
}

#attribution {
padding: 10px;
text-align: center;
background: black;
border-top: 1px solid black;
}

#attribution p {
margin: 0;
color: #555;
font-size: 12px;
}

#attribution a {
color: #555;
}

a.install {
position: fixed;
top: 30px;
right: 3px;
white-space: nowrap;
outline: 0;
text-decoration: none;
cursor: pointer;
overflow: hidden;
text-overflow: ellipsis;
font: 600 12px/18px "Helvetica Neue","HelveticaNeue",Helvetica,Arial,sans-serif;
height: 20px;
padding: 0 5px;
line-height: 18px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
-o-box-sizing: border-box;
box-sizing: border-box;
-webkit-transition-property: padding;
-moz-transition-property: padding;
-ms-transition-property: padding;
-o-transition-property: padding;
transition-property: padding;
-webkit-transition-duration: .1s;
-moz-transition-duration: .1s;
-ms-transition-duration: .1s;
-o-transition-duration: .1s;
transition-duration: .1s;
-webkit-transition-timing-function: ease;
-moz-transition-timing-function: ease;
-ms-transition-timing-function: ease;
-o-transition-timing-function: ease;
transition-timing-function: ease;
color: #fff;
border: 1px solid rgba(0,0,0,0.18);
background: #3e3e3e;
background: rgba(0,0,0,0.38);
text-shadow: 1px 1px 0 rgba(0,0,0,0.08);
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
color: #fff;
z-index: 104;

}

/* ==========================================================================
Media Queries
========================================================================== */

@media only screen and (min-device-width: 1025px) {
.container {
width: 100vw;
height: 100vh;
}

.title a {
opacity: 0.8;
}

.title a:hover {
opacity: 1;
}

.title h1 {
word-wrap: normal;
}

.title.index-title {
padding: 0;
}

.title.index-title a {
opacity: 1;
}

.title.index-title .title-text {
top: 20%;
}

.title h2 {
margin-left: 50px;
margin-right: 50px;
}

.title-text {
position: relative;
top: 0;
padding: 30px 0;
}

.post {
width: 100vw;
height: 100vh;
min-height: 480px;
}

.post.inline {
height: auto;
min-height: auto;
}

.post-bg {
background-size: contain;
background-attachment: fixed;
background-repeat: no-repeat;
}

.post-bg.tile {
background-size: contain;
}

.post-bg.fill {
background-size: cover;
}

.post-bg.center {
background-size: contain;
background-repeat: no-repeat;
}

.quote, .link {
padding: 0;
}

.link h3 {
font-size: 32px;
}

.quote blockquote {
font-size: 32px;
}

.quote .source {
font-size: 20px;
}


.text-block {
font-size: 20px;
width: 600px;
}


.audio_player {
width: 30vw;
margin: auto;
height: 125px;
}

.tumblr_audio_player {
width: 100%;
height: 100%;
position: relative;
top: 40%;
-webkit-transform: translate(0,0) !important;
}

.video iframe {
display: block;
width: 100vw;
height: 100vh;
margin: 0 auto;
position: relative;
top: 0;
}

.video .spotify_audio_player,
.video .bandcamp_audio_player,
.video .soundcloud_audio_player {
margin: auto;
}

.video .bandcamp_audio_player {
width: 500px;
height: auto;
}

.video .spotify_audio_player {
width: auto;
height: 50%;
}

#disqus_thread {
min-width: 500px;
}

#attribution {
padding: 20px;
font-size: 14px;
}
}

@media print,
(-o-min-device-pixel-ratio: 5/4),
(-webkit-min-device-pixel-ratio: 1.25),
(min-resolution: 120dpi) {
}



{CustomCSS}
</style>
{block:IfGoogleAnalyticsID}<script>
var _gaq = _gaq || [];
_gaq.push(['_setAccount', '{text:Google Analytics ID}']);
_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>{/block:IfGoogleAnalyticsID}
</head>
<body>
<a href="http://fixed.andrevv.com" target="_blank" class="install"><i class="fa-arrow-circle-down fa"></i> Install theme</a>
<div class="container {block:IndexPage}index-page{/block:IndexPage} {block:IfInfiniteScrolling}infinite-scrolling{/block:IfInfiniteScrolling}">
<div class="title {block:IndexPage}index-title{/block:IndexPage}">
<div class="title-text">
<h1><a href="/">{Title}</a></h1>
{block:IndexPage}
{block:IfShowDescription}
<h2>{Description}</h2>
{/block:IfShowDescription}
{/block:IndexPage}
</div>
</div>


{block:Posts}
<article class="post {TagsAsClasses}
{block:PermalinkPage}single{/block:PermalinkPage}
{block:Text}post-text{/block:Text}
{block:Quote}post-quote{/block:Quote}
{block:Link}post-link{/block:Link}
{block:Video}post-video{/block:Video}
{block:Audio}post-audio{/block:Audio}
{block:Photo}post-photo{/block:Photo}
{block:Photoset}post-photoset{/block:Photoset}
{block:Panorama}post-panorama{/block:Panorama}
{block:Chat}post-chat{/block:Chat}
{block:Answer}post-answer{/block:Answer}
">
{block:Text}
<div class="text post-bg">
<div class="text-block">
{block:Title}<h3>{Title}</h3>{/block:Title}
{Body}
</div>

</div>
{/block:Text}
{block:Quote}
<div class="quote post-bg">
<div class="quote-text">
<blockquote class="words {Length}">{Quote}</blockquote>
{block:Source}<p class="source">&mdash; {Source}</p>{/block:Source}
</div>
</div>
{/block:Quote}
{block:Link}
<div class="link post-bg">
<h3><i class="fa fa-link"></i> <a href="{URL}" {Target}>{Name}</a></h3>
</div>
{block:Description}<div class="caption"><span>{Description}</span></div>{/block:Description}
{/block:Link}
{block:Video}
<div class="video post-bg">
{Video-700}
</div>
{block:Caption}<div class="caption"><span>{Caption}</span></div>{/block:Caption}
{/block:Video}
{block:Audio}
<div class="audio post-bg" {block:AlbumArt}style="background-image: url({AlbumArtURL})"{/block:AlbumArt}>
{AudioPlayerBlack}
</div>
{block:Caption}<div class="caption"><span>{Caption}</span></div>{/block:Caption}
{/block:Audio}
{block:Photo}
<div class="photo post-bg {select:Photos}" style="background-image:url({PhotoURL-HighRes})" alt="{PhotoAlt}">
{LinkOpenTag}{LinkCloseTag}

</div>
{block:Caption}<div class="caption">
<span>{Caption}</span>
</div>{/block:Caption}
{/block:Photo}

{block:Photoset}
{block:Photos}
<div class="photoset post-bg {select:Photos}" style="background-image:url({PhotoURL-HighRes})" alt="{PhotoAlt}">
{LinkOpenTag}{LinkCloseTag}
</div>
{block:Caption}<div class="caption"><span>{Caption}</span></div>{/block:Caption}
{/block:Photos}
{block:Caption}<div class="caption"><span>{Caption}</span></div>{/block:Caption}
{/block:Photoset}

{block:Panorama}
<div class="post-bg panorama {select:Photos}" style="background-image:url({PhotoURL-HighRes})" alt="{PhotoAlt}">
{LinkOpenTag}{LinkCloseTag}
</div>
{block:Caption}<span class="caption"><span>{Caption}</span></span>{/block:Caption}
{/block:Panorama}

{block:Chat}
<div class="chat post-bg">
{block:Title}<h3>{Title}</h3>{/block:Title}
<ul class="conversation">
{block:Lines}
<li class="line {Alt}">
{block:Label}<span class="person">{Label}</span>{/block:Label}
<span class="person-said">{Line}</span>
</li>
{/block:Lines}
</ul>
</div>
{/block:Chat}
{block:Answer}
<div class="answer text post-bg">
<div class="text-block">
<img class="answer-avatar" src="{AskerPortraitURL-40}" />
{Asker}
{Question}
{Answer}
</div>
</div>
{/block:Answer}

{block:IndexPage}
<div class="meta">
<ul>
<li class="more-link">
<a href="{Permalink}">+</a>
</li>
</ul>
</div>
{/block:IndexPage}
{block:PermalinkPage}
<div class="meta">
<ul>
<li>
{block:Date}
{block:NewDayDate}{ShortMonth} {DayOfMonth}{/block:NewDayDate}
{block:SameDayDate}{ShortMonth} {DayOfMonth}{/block:SameDayDate}
{/block:Date}
</li>
{block:NoteCount}
<li>
<i class="fa fa-heart"></i> {NoteCount}
</li>
{/block:NoteCount}
</ul>
</div>
{/block:PermalinkPage}

</article>
{/block:Posts}

<footer>

<div class="Loading"><i class="fa fa-circle-o-notch fa-spin"></i></div>

{block:Pagination}
<nav class="pages-nav">
{block:PreviousPage}
<a href="{PreviousPage}" class="back">
<span class="arrow">&larr;</span>
</a>{/block:PreviousPage}{block:NextPage}<a href="{NextPage}" class="forward">
<span class="arrow">&rarr;</span>
</a>{/block:NextPage}
<div class="clear"></div>
</nav>
{/block:Pagination}
{block:PermalinkPagination}
<nav>
{block:PreviousPost}
<a href="{PreviousPost}" class="forward">
<span class="arrow">&rarr;</span>
</a>{/block:PreviousPost}{block:NextPost}<a href="{NextPost}" class="back">
<span class="arrow">&larr;</span>
</a>{/block:NextPost}
<div class="clear"></div>
</nav>
{/block:PermalinkPagination}

{block:PermalinkPage}

{block:PostNotes}
<div class="post-notes" id="notes">
{PostNotes-64}
</div>
{/block:PostNotes}

{block:IfDisqusShortname}
<div id="disqus_block">
<div id="disqus_thread"></div>
</div>
<script type="text/javascript">
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = '{text:Disqus Shortname}'; // Required - Replace example with your forum shortname

/* * * DON'T EDIT BELOW THIS LINE * * */
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>

{/block:IfDisqusShortname}
{/block:PermalinkPage}

<div class="clear"></div>

<!-- PLEASE DON'T REMOVE. THIS THEME IS A GIFT FROM ME TO YOU <3 -->

<div id="attribution">
<p>
<a href="http://fixed.andrevv.com/">Fixed. theme</a> by <a href="http://andrevv.com" target="_blank">Andrew McCarthy</a>
</p>
</div>

<!-- </3 -->
</footer>

</div>

{block:IfInfiniteScrolling}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js" type="text/JavaScript"></script>
<script src="http://static.tumblr.com/54tapni/EDTnl3s3c/jquery.autopager-1.0.0.js" type="text/JavaScript"></script>
<script type="text/javascript">
$.autopager({
link : 'nav.pages-nav .forward',
content: 'article.post',

// enable/disable scroll loading
autoLoad: true,

// initial page number
page: {CurrentPage},

// where contents would be appended.
// use "appendTo" or "insertBefore"
insertBefore: 'footer',
// insertBefore: '#footer',

// a callback function to be triggered when loading start
start: function(current, next) {
$('.infinite-scrolling').addClass('is-loading');
},

// a function to be executed when next page was loaded.
// "this" points to the element of loaded content.
load: function(current, next) {
$('.infinite-scrolling').removeClass('is-loading');
}
});
</script>
{/block:IfInfiniteScrolling}

{block:IfDisqusShortname}
<script type="text/javascript">
var disqus_shortname = '{text:Disqus Shortname}';

(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = '//' + disqus_shortname + '.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
{/block:IfDisqusShortname}
<div class="MenuStuff
{block:AskEnabled}Ask{/block:AskEnabled}
{block:SubmissionsEnabled}Submit{/block:SubmissionsEnabled}
{block:HasPages}Pages{/block:HasPages}
">
<input type="checkbox" id="ShowMenu" />
<div id="menu">
<h3>Menu</h3>
<ul class="{block:AskEnabled}Ask{/block:AskEnabled} {block:SubmissionsEnabled}Submit{/block:SubmissionsEnabled}">
{block:AskEnabled}
<li><a href="/ask">{AskLabel}</a></li>
{/block:AskEnabled}
{block:SubmissionsEnabled}
<li><a href="/submit">{SubmitLabel}</a></li>
{/block:SubmissionsEnabled}
</ul>
{block:HasPages}
<ul class="Pages">
{block:Pages}<li><a href="{URL}">{Label}</a></li>{/block:Pages}
</ul>
{/block:HasPages}


</div>
<label for="ShowMenu">
<span></span>
</label>
</div>
</body>
</html>


Christian J
Mar 15 2016, 03:32 PM
This looks like Tumblr code, so I move the thread.
Frederiek
Mar 16 2016, 11:58 AM
You could try using: background-size: cover;.

See :
- http://academyoftumblr.tumblr.com/post/121...ackground-image
- http://css3files.com/background/
- http://caniuse.com/#search=background-size
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.
Invision Power Board © 2001-2024 Invision Power Services, Inc.