The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

 
Reply to this topicStart new topic
> Need Help With Tumblr HTML
Perfectionsistneedshelp
post May 22 2017, 11:44 PM
Post #1





Group: Members
Posts: 1
Joined: 22-May 17
Member No.: 26,414



Hey my names Mikayla and I have a few problems with my custom HTML. I made a tumblr account years ago and used Kylie Jenner’s HTML and it was all sweet but since deleting my account to start a fresh tumblr I have experienced some glitches in my HTML code.

1) My header is not left side aligned how do I change this to centre alignment? Also I would like the text to be a touch larger
2) There’s a grey box that used to have load more posts on it and it was at the bottom of the page. Since turning on infinite scroll the text has disappeared but the box is still there and now at the top of my posts. How do I get rid of that?
3) Also this isn’t huge cause I know a way of sorting it out but as you can see if you go on my page my photos don’t fit in next to each other. I’m guessing this is cause there isn’t enough room. So how do I widen the space that the photos get posted in? I know I could just trim every photo or arrange photos that fit but it would be a lot easier if the space were wider.

My page is https://mikaylalogue.tumblr.com

My HTML is

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta content="#151515" name="color:Body Background">
<meta content="#000000" name="color:Posts Background">
<meta content="#DDDDDD" name="color:Posts Title">
<meta content="#999999" name="color:Posts Text">
<meta content="#999999" name="color:Posts Links">
<meta content="#EEEEEE" name="color:Header Title">
<meta content="#666666" name="color:Header Links">
<meta content="" name="image:Background">
<meta content="" name="image:Header">
<meta content="0" name="if:Post width 150px">
<meta content="0" name="if:Post width 250px">
<meta content="0" name="if:Post width 300px">
<meta content="1" name="if:Post width 400px">
<meta content="0" name="if:Post width 500px">
<meta content="1" name="if:Infinite Scroll">
<meta content="1" name="if:Post Shadow">
<meta content="1" name="if:Post Round Borders">
<meta content="0" name="if:Post Hide Permalinks">
<meta content="1" name="if:Post Hide Caption">
<meta content="1" name="if:Header Text Center">
<meta content="0" name="if:Header BlogRoll">
<meta content="0" name="if:Full Page Background Image">
<meta content="Reblog This" name="text:Post Reblog Title">
<meta content="Previous" name="text:Previous Page Title">
<meta content="Next" name="text:Next Page Title">
<meta content="Ask" name="text:Ask Title">
<meta content="" name="text:Link 1">
<meta content="" name="text:Link 1 Title">
<meta content="" name="text:Link 2">
<meta content="" name="text:Link 2 Title">
<meta content="" name="text:Link 3">
<meta content="" name="text:Link 3 Title">
<meta content="" name="text:Link 4">
<meta content="" name="text:Link 4 Title">
<meta content="" name="text:Link 5">
<meta content="" name="text:Link 5 Title">
<title>{Title}</title>
<link href="{Favicon}" rel="shortcut icon">
<link href="{RSS}" rel="alternate" type="application/rss+xml">
</head>
<body>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Dancing+Script:400,700' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'>
<script src="http://themaxdavisthemes.com/code/jQuery.js" type="text/javascript">
</script> {block:IndexPage}{block:ifInfiniteScroll}
<script src="http://static.tumblr.com/twte3d7/0pellzh2t/infinitescroll.js">
</script>{/block:ifInfiniteScroll}
<script src="http://static.tumblr.com/me5sfsd/12Qlmj66n/script.js">
</script>
<script>
$(window).load(function(){
var $wall = $('#container');
$wall.masonry({
itemSelector: '.entry, .entry_load{block:ifNotInfiniteScroll}, .navi{/block:ifNotInfiniteScroll}',
{block:ifpostwidth150px}columnWidth: 180,{/block:ifpostwidth150px}
{block:ifpostwidth250px}columnWidth: 280,{/block:ifpostwidth250px}
{block:ifpostwidth300px}columnWidth: 330,{/block:ifpostwidth300px}
{block:ifpostwidth400px}columnWidth: 440,{/block:ifpostwidth400px}
{block:ifpostwidth500px}columnWidth: 520,{/block:ifpostwidth500px}
isAnimated: !Modernizr.csstransitions,
isFitWidth: true
});

$wall.infinitescroll({
navSelector : '#page-nav',
nextSelector : '#page-nav a',
itemSelector : '.entry',
donetext : 'The End.',
loadingText : 'Loading...',
extraScrollPx : 0,
bufferPx : 20000,
behavior : 'twitter',
debug : false,
errorCallback: function() {
$('#infscr-loading').animate({opacity: .8},2000).fadeOut('normal');
}},
function( newElements ) {
var $newElems = $( newElements );
$newElems.hide();
$newElems.imagesLoaded(function(){
$wall.masonry( 'appended', $newElems, {isAnimated: true, animationOptions: {duration: 750, easing: 'linear', queue: false}}, function(){$newElems.fadeIn();} );
});
}); $wall.show(500);

$('#load').click(function(e){

e.preventDefault();
$wall.infinitescroll('retrieve');
$(this).css('display','block');

});
});

</script>{/block:IndexPage}
<style type="text/css">
html { {block:iffullpagebackgroundimage} background:{color:Body Background} url({image:Background}) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; {/block:iffullpagebackgroundimage}} a { color:{color:Posts Links}; text-decoration:none; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear;} a:hover{ color:{color:Posts Hover}; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear;} a:active{outline: none;} a:focus{-moz-outline-style: none;} :-moz-any-link:focus{outline: none;} img{border:none;} .clear{clear:both} body { font: 11px 'Open Sans', Arial, sans-serif; {block:ifNotfullpagebackgroundimage} background:{color:Body Background} url({image:Background}) repeat center top; {/block:ifNotfullpagebackgroundimage} color:{color:Posts Text};} /**** Content ****/ #content { padding: 10px;} /**** Blog ****/ #container { background-color:transparent; margin-bottom: 20px; clear: both; {block:PermalinkPage} width:900px; margin:auto; {/block:PermalinkPage}} .centered { margin: 0 auto; } #header{ max-width:900px; margin:0 auto 20px; padding:10px 0; color:{color:Header}; border-bottom:solid 1px rgba(0,0,0,0.1);} #header .header_image{ max-width:1000px; max-height:300px;} #header h1{ font-size:60px; line-height:70px; font-family:oswald; font-weight:normal; color:{color:Header Title}; margin:0 auto 20px; padding:0; word-spacing:10px; {block:ifHeaderTextCenter} text-align:center; {/block:ifHeaderTextCenter}} #header .{ max-width:900px; color:{color:Header}; {block:ifHeaderTextCenter} text-align:center; {/block:ifHeaderTextCenter} {block:ifHeaderimage} text-align:center; {/block:ifHeaderimage} {block:ifHeaderHideDescription} display:none; padding:0 0 10px; {/block:ifHeaderHideDescription} } #header .description_button{ cursor:help;} #header .links{ max-width:1000px; padding: 15px 0 0; clear: both; {block:ifHeaderTextCenter} text-align:center; {/block:ifHeaderTextCenter}} #header .links a{ padding:0 20px; text-transform:uppercase; color:{color:HeaderLinks};} #header .links a:hover{ color:{color:HeaderDescription};} /**** Blogroll ****/ #header .blogroll{ max-width:500px; margin:0 auto; display:none; {block:ifHeaderTextCenter} text-align:center; {/block:ifHeaderTextCenter} {block:ifHeaderimage} text-align:center; {/block:ifHeaderimage} {block:ifHeaderHideDescription} padding:10px 0 0; {/block:ifHeaderHideDescription} } #header .blogroll_button{ cursor:help;} #header ul.blogroll_img{ margin:0; padding:0; list-style:none;} #header ul.blogroll_img li{ float:left; height: 22px;} #header ul.blogroll_img li img{ width:20px; height:20px; margin:1px;} /**** Posts ****/ .entry { background:{color:Posts Background}; overflow:hidden; {block:IndexPage} {block:ifpostwidth150px}margin: 5px;{/block:ifpostwidth150px} {block:ifpostwidth250px}margin: 5px;{/block:ifpostwidth250px} {block:ifpostwidth300px}margin: 5px;{/block:ifpostwidth300px} {block:ifpostwidth400px}margin: 10px;{/block:ifpostwidth400px} {block:ifpostwidth500px}margin: 10px;{/block:ifpostwidth500px} width:250px; padding: 10px; float: left; {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:480px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage} width:860px; padding: 20px; margin-bottom:5px; float: left; {/block:PermalinkPage} {block:ifPostRoundBorders} border-radius: 4px; {/block:ifPostRoundBorders} {block:ifPostShadow} box-shadow: 0px 0px 5px rgba(0,0,0,0.1), 0px 0px 30px rgba(100, 100, 100, 0.1) inset; {/block:ifPostShadow}} .photo { {block:IndexPage} padding:0px;background:transparent; {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage} background-color:black; float: left; width:900px; padding:0px; {/block:PermalinkPage}} .video { padding:0; background-color:black; {block:IndexPage} {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage} width:900px; float: left; {/block:PermalinkPage}} .audio { padding:0; background-color:black; {block:IndexPage} {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage} width:900px; float: left; {/block:PermalinkPage}} .post img{ height:auto; {block:ifpostwidth150px}max-width:140px;{/block:ifpostwidth150px} {block:ifpostwidth250px}max-width:240px;{/block:ifpostwidth250px} {block:ifpostwidth300px}max-width:290px;{/block:ifpostwidth300px} {block:ifpostwidth400px}max-width:390px;{/block:ifpostwidth400px} {block:ifpostwidth500px}max-width:470px;{/block:ifpostwidth500px}} .container_load { margin:10px auto; padding: 10px; background:{color:Posts Background}; font-weight:700; {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px} text-align:center; {block:ifPostRoundBorders} border-radius: 4px; {/block:ifPostRoundBorders} {block:ifPostShadow} box-shadow: 0px 0px 5px rgba(0,0,0,0.1), 0px 0px 30px rgba(100, 100, 100, 0.1) inset; {/block:ifPostShadow}} .entry h1{ font-size:18px; {block:ifpostwidth150px} font-size:15px; letter-spacing:-0.5px; {/block:ifpostwidth150px} line-height:30px; color:{color:Posts Title}; margin:0 auto 10px; padding:0;} #permalink{ padding:0; margin:15px 0 0; text-align:center; {block:ifPostHidePermalinks} display:none; {/block:ifPostHidePermalinks}} #permalink .notes{float:left;} #permalink .date{text-align:center; {block:ifpostwidth150px}display:none;{/block:ifpostwidth150px} {block:ifpostwidth250px}display:none;{/block:ifpostwidth250px} {block:ifpostwidth300px}display:none;{/block:ifpostwidth300px}} #permalink .permalink{float:right;} /**** Posts: Photos ****/ #photo { overflow:hidden; {block:IndexPage} max-width:500px; {block:ifpostwidth150px}max-width:170px;{/block:ifpostwidth150px} {block:ifpostwidth250px}max-width:270px;{/block:ifpostwidth250px} {block:ifpostwidth300px}max-width:320px;{/block:ifpostwidth300px} {block:ifpostwidth400px}max-width:420px;{/block:ifpostwidth400px} {block:ifpostwidth500px}max-width:500px;{/block:ifpostwidth500px} {/block:IndexPage} {block:ifPostRoundBorders} {block:ifPostHideCaption} border-radius: 4px; {/block:ifPostHideCaption} {block:ifNotPostHideCaption} border-top-right-radius: 4px; border-top-left-radius: 4px; {/block:ifNotPostHideCaption} {/block:ifPostRoundBorders} {block:PermalinkPage} width: 900px; {/block:PermalinkPage}} #photo a{ color:white;} #photo a:hover{ color:white;} #photo img { {block:IndexPage} {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px} {/block:IndexPage} display:block;} div#photo div#picture { position:relative;} div#photo div#picture div#info_2 { position:absolute; top:0; left:0; opacity:0; width:250px; {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:480px;{/block:ifpostwidth500px} margin-top:-50px; height:auto; padding:15px 10px; {block:ifpostwidth150px} padding:10px; {/block:ifpostwidth150px} background-color:rgba(0,0,0,0.7); visibility:hidden; z-index:998; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease;} div#photo:hover div#picture div#info_2 { opacity:1; margin-top:0px; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease;} div#photo div#picture div#info_2 div#holder { {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:480px;{/block:ifpostwidth500px} height:auto; z-index:999; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear;} div#photo div#picture div#info_2 div#holder #month { font-size:8px; {block:ifNotpostwidth150px} float:right; text-align:right; {/block:ifNotpostwidth150px} color:white; text-transform:uppercase; -webkit-transition: all 0.4s linear; -moz-transition: all 0.4s linear; transition: all 0.4s linear;} div#photo div#picture div#info_2 div#holder #note_count { font-family:arial; text-transform:uppercase; color:white; letter-spacing:-1px; {block:ifNotpostwidth150px} float:left; font-size:25px; line-height:25px; {/block:ifNotpostwidth150px} {block:ifpostwidth150px} display:block; font-size:20px; line-height:20px; {/block:ifpostwidth150px} font-weight:bold; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; transition: all 0.2s linear;} div#photo div#picture:hover div#info_2 {visibility:visible;} #reblog { background-color:rgba(0,0,0,0.7); position:absolute; color:#FFFFFF; font-family:dancing script; text-align:center; text-transform:capitalize; {block:ifpostwidth150px}width:170px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:270px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:320px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:420px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:500px;{/block:ifpostwidth500px} {block:ifNotpostwidth150px} font-size:25px; padding:15px 0px; {/block:ifNotpostwidth150px} {block:ifpostwidth150px} font-size:20px; padding:10px 0px; {/block:ifpostwidth150px} line-height:10px; opacity:0; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease;} .entry:hover #reblog { {block:ifNotpostwidth150px} margin-top:-40px; {/block:ifNotpostwidth150px} {block:ifpostwidth150px} margin-top:-30px; {/block:ifpostwidth150px} opacity:1; -webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; transition: all 0.5s ease;} .caption{ padding:5px 10px; background:{color:Posts Background};} .caption img{ height:auto; {block:IndexPage} {block:ifpostwidth150px}max-width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}max-width:230px;{/block:ifpostwidth250px} {block:ifpostwidth300px}max-width:280px;{/block:ifpostwidth300px} {block:ifpostwidth400px}max-width:380px;{/block:ifpostwidth400px} {block:ifpostwidth500px}max-width:460px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage}max-width:840px;{/block:PermalinkPage}} #permalink_image{ margin:10px auto; -webkit-box-shadow: inset 0 0 50px rgba(0,0,0,1); -moz-box-shadow: inset 0 0 50px rgba(0,0,0,1); -o-box-shadow: inset 0 0 50px rgba(0,0,0,1); box-shadow: inset 0 0 50px rgba(0,0,0,1);} /**** Posts: Text ****/ #text blockquote { margin:5px 10px; padding:0;} #text li { list-style:none; margin:0; padding:0;} #text img{ height:auto; {block:IndexPage} {block:ifpostwidth150px}max-width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}max-width:230px;{/block:ifpostwidth250px} {block:ifpostwidth300px}max-width:280px;{/block:ifpostwidth300px} {block:ifpostwidth400px}max-width:380px;{/block:ifpostwidth400px} {block:ifpostwidth500px}max-width:460px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage}max-width:840px;{/block:PermalinkPage}} /**** Posts: Videos ****/ #video{ margin:5px;} /**** Posts: Audio ****/ #audio{ margin:5px; {block:ifpostwidth150px}margin:5px 70px;{/block:ifpostwidth150px}} .playcount{ float:right; margin-top:-26px; font-family:oswald; color:white; font-size:15px; margin-right:10px; {block:ifpostwidth150px}display:none;{/block:ifpostwidth150px} {block:ifpostwidth250px}display:none;{/block:ifpostwidth250px} {block:ifpostwidth300px}display:none;{/block:ifpostwidth300px}} /**** Posts: Chat ****/ .entry ul.chat{ margin:0; padding:0; list-style:none;} .entry ul.chat li{ padding:7px 10px; border-top:1px solid rgba(0,0,0,0.1); margin:5px 0;} .entry ul.chat li:nth-child(1){ border:0} /**** Posts: Questions ****/ .entry .asker_portrait{ float:left; width:30px; height:30px; margin-right:5px; margin-bottom:5px;} .entry .question{ float:left; line-height:11px; margin-bottom:10px; {block:IndexPage} {block:ifpostwidth150px}max-width:110px;{/block:ifpostwidth150px} {block:ifpostwidth250px}max-width:190px;{/block:ifpostwidth250px} {block:ifpostwidth300px}max-width:240px;{/block:ifpostwidth300px} {block:ifpostwidth400px}max-width:340px;{/block:ifpostwidth400px} {block:ifpostwidth500px}max-width:420px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage} width:840px; {/block:PermalinkPage}} .entry .answer{ margin-top:5px; line-height:11px; clear:both; display:block; font-style:italic; {block:IndexPage} {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:230px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:280px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:380px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:460px;{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage} width:870px; {/block:PermalinkPage}} .navi { background:{color:Posts Background}; overflow:hidden; {block:ifpostwidth150px}margin: 5px;{/block:ifpostwidth150px} {block:ifpostwidth250px}margin: 5px;{/block:ifpostwidth250px} {block:ifpostwidth300px}margin: 5px;{/block:ifpostwidth300px} {block:ifpostwidth400px}margin: 10px;{/block:ifpostwidth400px} {block:ifpostwidth500px}margin: 10px;{/block:ifpostwidth500px} width:250px; padding: 10px; float: left; {block:ifpostwidth150px}width:150px;{/block:ifpostwidth150px} {block:ifpostwidth250px}width:250px;{/block:ifpostwidth250px} {block:ifpostwidth300px}width:300px;{/block:ifpostwidth300px} {block:ifpostwidth400px}width:400px;{/block:ifpostwidth400px} {block:ifpostwidth500px}width:480px;{/block:ifpostwidth500px} {block:ifPostRoundBorders} border-radius: 4px; {/block:ifPostRoundBorders} {block:ifPostShadow} box-shadow: 0px 0px 5px rgba(0,0,0,0.1), 0px 0px 30px rgba(100, 100, 100, 0.1) inset; {/block:ifPostShadow}} .space{ height:10px;} /**** Posts: Notes ****/ #notes { float: left; margin: 15px 0; padding: 10px; width: 880px; background-color:{color:Posts Background}; {block:ifPostRoundBorders} border-radius: 4px; {/block:ifPostRoundBorders} {block:ifPostShadow} box-shadow: 0px 0px 5px rgba(0,0,0,0.1), 0px 0px 30px rgba(100, 100, 100, 0.1) inset; {/block:ifPostShadow}} .notes_button{ color:{color:Posts Links} cursor:help;} ol.notes { padding: 0; margin: 0; list-style-type: none; display:none;} ol.notes li.note { padding: 1px; float:left;} ol.notes li.note img.avatar { vertical-align: -4px; width: 20px; height: 20px;} ol.notes li.note span.action { font-weight:normal; display:none;} ol.notes li.note .answer_content { font-weight: normal; display:none;} ol.notes li.note blockquote { padding: 4px 10px; margin: 10px 0px 0px 25px; display:none;} ol.notes li.note blockquote a { text-decoration: none; display:none;} ol.notes more_notes_link_container{ text-align:center; height:14px; padding:3px; width:104px; margin:1px; background-color:rgba(0,0,0,0.1);} ol.notes more_notes_link_container:hover{ background-color:rgba(0,0,0,0);} /**** Posts: Permalink Post Info ****/ #post_info{ float: left; margin: 15px 0 0; padding: 10px; width: 880px; background-color:{color:Posts Background}; {block:ifPostRoundBorders} border-radius: 4px; {/block:ifPostRoundBorders} {block:ifPostShadow} box-shadow: 0px 0px 5px rgba(0,0,0,0.1), 0px 0px 30px rgba(100, 100, 100, 0.1) inset; {/block:ifPostShadow}} /**** Transitions ****/ .transitions-enabled.masonry, .transitions-enabled.masonry .masonry-brick { -webkit-transition-duration: 0.7s; -moz-transition-duration: 0.7s; -o-transition-duration: 0.7s; transition-duration: 0.7s;} .transitions-enabled.masonry { -webkit-transition-property: height, width; -moz-transition-property: height, width; -o-transition-property: height, width; transition-property: height, width;} .transitions-enabled.masonry .masonry-brick { -webkit-transition-property: left, right, top; -moz-transition-property: left, right, top; -o-transition-property: left, right, top; transition-property: left, right, top;}
</style>{block:ifInfiniteScroll} {block:NextPage}
<div id="page-nav">
<a href="{NextPage}"></a>
</div>{/block:NextPage}{/block:ifInfiniteScroll}
<div id="content">
<div id="header">
{block:ifHeaderimage}
<center>
<a href="/" title="Home"><img class="header_image" src="{image:Header}"></a>
</center>{/block:ifHeaderimage} {block:ifNotHeaderimage} <a href="/" title="Home">
<h1>{title}</h1></a>{/block:ifNotHeaderimage} {block:Description}
<div class="description">
{Description}
</div>{/block:Description} {block:Following}
<div class="blogroll">
<ul class="blogroll_img">
<li style="list-style: none">{block:Followed}</li>
<li>
<a href="{FollowedURL}" target="_blank" title="{FollowedName}"><img src="{FollowedPortraitURL-24}"></a>
</li>
<li style="list-style: none">{/block:Followed}</li>
</ul>
</div>{/block:Following}
<div class="links">
{block:AskEnabled} <a href="/ask">{block:ifasktitle}{text:Ask Title}{/block:ifasktitle} {block:ifnotasktitle}{AskLabel}{/block:ifnotasktitle}</a> {/block:AskEnabled} {block:ifHeaderHideDescription} <a class="description_button" title="Description">Description</a> {/block:ifHeaderHideDescription} {block:ifHeaderBlogRoll} <a class="blogroll_button" title="Blogs I follow">Blogroll</a> {/block:ifHeaderBlogRoll} {block:ifLink1Title} <a href="{text:Link%201}" title="{text:Link 1 Title}">{text:Link 1 Title}</a> {/block:ifLink1Title} {block:ifLink2Title} <a href="{text:Link%202}" title="{text:Link 2 Title}">{text:Link 2 Title}</a> {/block:ifLink2Title} {block:ifLink3Title} <a href="{text:Link%203}" title="{text:Link 3 Title}">{text:Link 3 Title}</a> {/block:ifLink3Title} {block:ifLink4Title} <a href="{text:Link%204}" title="{text:Link 4 Title}">{text:Link 4 Title}</a> {/block:ifLink4Title} {block:ifLink5Title} <a href="{text:Link%205}" title="{text:Link 5 Title}">{text:Link 5 Title}</a> {/block:ifLink5Title} {block:HasPages} {block:Pages} <a href="{URL}" title="{Label}">{Label}</a> {/block:Pages} {/block:HasPages}
</div>{block:ifHeaderHideDescription}
<script>
$('.description_button').click(function() {
$('#header .description').slideToggle('medium', function() {
});
});
</script> {/block:ifHeaderHideDescription}
<script>
$('.blogroll_button').click(function() {
$('#header .blogroll').slideToggle('medium', function() {
});
});
</script>
</div>
<div class="transitions-enabled centered clearfix" id="container">
{block:Posts}
<div class="entry{block:Photo} photo{/block:Photo}{block:Video} video{/block:Video}{block:Audio} audio{/block:Audio}">
{block:Text} {block:Title} <a href="{Permalink}">
<h1>{Title}</h1></a> {/block:Title}
<div id="text">
{Body}
</div>{block:IndexPage} {block:Date}
<div id="permalink">
{block:NoteCount} <a class="notes" href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount} <a class="permalink" href="{Permalink}">❖ Permalink</a> <a class="date" href="{Permalink}">{TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
</div>{/block:Date} {/block:IndexPage} {/block:Text} {block:Photo}
<div id="photo">
<div id="picture">
{block:IndexPage} {block:Date}
<div id="info_2">
<div id="holder">
<div id="note_count">
<a href="{Permalink}">{block:NoteCount} {NoteCountWithLabel}{/block:NoteCount}</a>
</div>
<div id="month">
<a href="{Permalink}">{block:ifNotpostwidth150px}Posted on {DayOfWeek},<br>
{DayOfMonth} {Month} {Year}. {/block:ifNotpostwidth150px} {block:ifpostwidth150px} {TimeAgo} {/block:ifpostwidth150px}</a>
</div>
</div>
</div>{/block:Date} <img src="{block:ifNotpostwidth150px}{PhotoURL-HighRes}{/block:ifNotpostwidth150px}{block:ifpostwidth150px}{PhotoURL-250}{/block:ifpostwidth150px}">{/block:IndexPage} {block:PermalinkPage}
<div align="center" id="permalink_image"><img src="{PhotoURL-500}"></div>{/block:PermalinkPage} {block:IndexPage}{block:IfPostReblogTitle} <a href="{ReblogURL}" target="_blank">
<div id="reblog">
{text:Post Reblog Title}
</div></a>{/block:ifPostReblogTitle}{/block:IndexPage}
</div>
</div>{block:IndexPage} {block:ifNotPostHideCaption}{block:Caption} <a href="{Permalink}">
<div class="caption">
{Caption}
</div></a> {/block:Caption}{/block:ifNotPostHideCaption} {/block:IndexPage} {block:PermalinkPage} {block:Caption}
<div class="caption">
{Caption}
</div>{/block:Caption} {/block:PermalinkPage} {/block:Photo} {block:Photoset}
<center>
{block:IndexPage} {block:ifpostwidth150px}{Photoset-250}{/block:ifpostwidth150px} {block:ifpostwidth250px}{Photoset-250}{/block:ifpostwidth250px} {block:ifpostwidth300px}{Photoset-250}{/block:ifpostwidth300px} {block:ifpostwidth400px}{Photoset-400}{/block:ifpostwidth400px} {block:ifpostwidth500px}{Photoset-500}{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage}{Photoset-500}{/block:PermalinkPage}
</center>{block:Caption}
<div class="caption">
{Caption}
</div>{/block:Caption} {block:IndexPage} {block:Date}
<div id="permalink">
{block:NoteCount} <a class="notes" href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount} <a class="permalink" href="{Permalink}">❖ Permalink</a> <a class="date" href="{Permalink}">{TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
</div>{/block:Date} {/block:IndexPage} {/block:Photoset} {block:Quote}
<center>
<a href="{Permalink}">
<h1>"{Quote}"</h1></a>
</center>{block:Source}
<div align="center" class="source">
{Source}
</div>{/block:Source} {block:IndexPage} {block:Date}
<div id="permalink">
{block:NoteCount} <a class="notes" href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount} <a class="permalink" href="{Permalink}">❖ Permalink</a> <a class="date" href="{Permalink}">{TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
</div>{/block:Date} {/block:IndexPage} {/block:Quote} {block:Link} <a class="link" href="{URL}">
<h1>{Name}</h1></a> {block:Description}
<div class="description">
{Description}
</div>{/block:Description} {block:IndexPage} {block:Date}
<div id="permalink">
{block:NoteCount} <a class="notes" href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount} <a class="permalink" href="{Permalink}" target="_blank">❖ Permalink</a> <a class="date" href="{Permalink}">{TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
</div>{/block:Date} {/block:IndexPage} {/block:Link} {block:Audio}
<div id="audio">
{AudioPlayerBlack}
<div class="playcount">
{PlayCountWithLabel}
</div>
</div>{block:Caption}
<div class="caption">
{Caption}
</div>{/block:Caption} {/block:Audio} {block:Answer} <img class="asker_portrait" src="{AskerPortraitURL-30}">
<div class="question">
{Asker} asked:<br>
{Question}
</div>
<div class="answer">
{Answer}
</div>{block:IndexPage} {block:Date}
<div id="permalink">
{block:NoteCount} <a class="notes" href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount} <a class="permalink" href="{Permalink}">❖ Permalink</a> <a class="date" href="{Permalink}">{TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
</div>{/block:Date} {/block:IndexPage} {/block:Answer} {block:Chat} {block:Title} <a href="{Permalink}">
<h1>{Title}</h1></a> {/block:Title}
<ul class="chat">
<li style="list-style: none">{block:Lines}</li>
<li class="{Alt} user_{UserNumber}">{block:Label} <span class="label">{Label}</span> {/block:Label} {Line}</li>
<li style="list-style: none">{/block:Lines}</li>
</ul>{block:IndexPage} {block:Date}
<div id="permalink">
{block:NoteCount} <a class="notes" href="{Permalink}">{NoteCountWithLabel}</a> {/block:NoteCount} <a class="permalink" href="{Permalink}">❖ Permalink</a> <a class="date" href="{Permalink}">{TimeAgo} on {DayOfMonth} {ShortMonth} {Year}</a>
</div>{/block:Date} {/block:IndexPage} {/block:Chat} {block:Video}
<center>
<div id="video">
{block:IndexPage} {block:ifpostwidth150px}{Video-250}{/block:ifpostwidth150px} {block:ifpostwidth250px}{Video-250}{/block:ifpostwidth250px} {block:ifpostwidth300px}{Video-250}{/block:ifpostwidth300px} {block:ifpostwidth400px}{Video-400}{/block:ifpostwidth400px} {block:ifpostwidth500px}{Video-500}{/block:ifpostwidth500px} {/block:IndexPage} {block:PermalinkPage}{Video-500}{/block:PermalinkPage}
</div>
</center>{block:Caption} <a href="{Permalink}">
<div class="caption">
{Caption}
</div></a> {/block:Caption} {/block:Video}
</div>{block:PermalinkPage} {block:Date}
<div id="post_info">
This post is posted on {DayOfWeek} {DayOfMonth} {Month} {Year}.<br>
{block:NoteCount} Currently has {NoteCountWithLabel}<br>
{/block:NoteCount} {block:HasTags} Tagged as: {block:Tags} <a href="{TagURL}" style="text-decoration:underline;">{Tag}</a> {/block:Tags}<br>
{/block:HasTags}
</div>{/block:Date} {/block:PermalinkPage} {block:PostNotes}
<div id="notes">
{NoteCountWithLabel} - <span class="notes_button">Show notes</span> {PostNotes}
<script>
$('.notes_button').click(function() {
$('ol.notes').slideToggle('slow', function() {
});
});
</script>
</div>{/block:PostNotes} {/block:Posts} {block:ifNotInfiniteScroll}{block:IndexPage}{block:Pagination}
<div class="navi">
{block:PreviousPage} <a href="{PreviousPage}">{text:Previous Page Title}</a> {/block:PreviousPage} {block:NextPage} <a href="{NextPage}" style="float: right;">{text:Next Page Title}</a> {/block:NextPage}
</div>{/block:Pagination}{/block:IndexPage}{/block:ifNotInfiniteScroll}
</div><!-- #container -->
{block:ifNotInfiniteScroll}
<div class="clear">
<div class="space"></div>
</div>{/block:ifNotInfiniteScroll} {block:ifInfiniteScroll} {block:IndexPage}
<div class="container_load">
<a href="#" id="load"></a><br>
</div>{/block:IndexPage}{/block:ifInfiniteScroll}
</div>
</body>
</html>

Thankyou so much for your time and effort

Mikayla Logue
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Angelhart
post Aug 23 2017, 12:50 PM
Post #2





Group: Members
Posts: 6
Joined: 8-August 15
Member No.: 23,242



Hi,

1) I can see your Header is centered. Not left aligned. Or do you mean the discription of your blog?

You should be able to change the font setting on your blog. If not then you will have to search for : 'font-size'

For example: the header font-size is 60px coding:

#header h1{ font-size:60px

Just change the number 60 in the number you want to use.

2) I don't see a grey box.

3) when I check your blog the photo's are perfectly aligned. Even when I change the browser screen size they remain perfectly aligned. At a small screen they go beneath each other.


User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

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

 



- Lo-Fi Version Time is now: 28th March 2024 - 05:59 PM