1 reply [Last post]
pureneon
pureneon's picture
Offline
newbie
NZ
Last seen: 7 years 17 weeks ago
NZ
Timezone: GMT+13
Joined: 2014-02-14
Posts: 1
Points: 2

Hello, recently I have started a new tumblr blog and decided to use a very simple theme. Turns out that the creator really only did the basics so I decided to change a lot of things to make it look cleaner.

If you look closely, you can see the "notes" overlap the images, and I would like to nudge it to the right so that it sits next to the images (obviously). I tried changing the margin values but it stays stuck so I thought I would ask for help here. I usually just tweak things until it works and looks right but I seem to be stuck on this one. Any help would be appreciated.

I might note that this happened after I changed {block:ifsmallimages} sizes to 500px as they were previously 400px. I did this because the normal 500px settings would not resize the images so that they the same width.

Thanks in advance Glasses

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>
<head>
<!-- 
Tremble Theme
Kelsey (<a href="http://www.atonals.tumblr.com" rel="nofollow">http://www.atonals.tumblr.com</a>)
This text should never be deleted, nor should the credit link placed in the theme code.
 
-->
 
<title>{Title}</title>
 
<link rel="shortcut icon" href="{Favicon}">
<link rel="alternate" type="application/rss+xml" href="{RSS}">
{block:Description}
<meta name="description" content="{MetaDescription}" />
{/block:Description}
 
<meta name="color:text" content="#3c3c3c"/>
<meta name="color:links" content="#000000"/>
<meta name="color:link hover" content="#dddddd"/>
<meta name="color:background" content="#ffffff"/>
<meta name="if:small images" content="0"/>
<meta name="if:endless scroll" content="0" />
<meta name="if:photo information" content="0" />
<meta name="if:show captions" content="0"/>
<meta name="text:blogtitle size" content="25" />
<meta name="text:text size" content="12" />
 
<meta name="font:body" content="baskerville" />
<meta name="font:title" content="Baskerville" />
 
 
<style type="text/css">
 
iframe#tumblr_controls {
top: 0% !important;
right:0% !important; 
position: absolute !important;}
 
body {background: {color:background};font-family: {font:body};font-size: {text:text size}px;color: {color:Text};line-height:15px;text-align: justify;}
 
a:hover {color: {color:link hover};-webkit-transition-duration: .5s;}
a {color: {color:Links};text-decoration: none;-webkit-transition-duration: .5s;}
 
.caption {margin-top:5px;margin-bottom:5px;text-align:left;}
.title {font-size:{text:blogtitle size}px; text-transform:uppercase;}
.content{width:500px;margin-top:20px;margin:auto;{block:ifsmallimages}width:500px;{/block:ifsmallimages}}
 
 
.post{margin-bottom:30px;width:500px; font-size:{text:text size}px;{block:ifsmallimages}width:500px;{/block:ifsmallimages}{block:permalinkpage}width:500px;{/block:permalinkpage}}
.post img{{block:ifsmallimages}width:500px;{block:ifsmallimages}{block:permalinkpage}width:500px;{/block:permalinkpage}}
.audio {background-color:#000000;width:500px;{block:ifsmallimages}width:500px;{/block:ifsmallimages}}
 
 
.post:hover .photoinfo{opacity:1;-webkit-transition-duration: .5s;}
.photoinfo {-webkit-transition-duration: .5s;opacity:.5;font-style:italic;margin-left:510px;{block:ifsmallimages}margin-left:410px;{/block:ifsmallimages}position:absolute;width:50px;text-align:left;}
 
 
 
 
 
::-webkit-scrollbar-thumb:vertical { background-color:{color:Text}; height:100px; }
::-webkit-scrollbar-thumb:horizontal { background-color:{color:background}; height:10px !important; }
::-webkit-scrollbar { height:10px; width:10px; background-color:{color:background}; }
 
 
.permalink {text-align:right;opacity:1;} 
.notetitle {padding-left:14px;text-transform:none;padding-bottom:10px; text-align:left;}
.notes {margin-top:-4px; margin-bottom:25px; text-align:left;margin-left:5px;}
ol.notes li.note {padding:10px;}
ol.notes {max-height: 250px;width:480px; overflow: auto;}
img.avatar {display: none;}
 
 
.blogtitle {font-size:{text:blogtitle size}px; font-family:{font:title}; line-height:15px;text-align:left;width:500px;position:fixed;bottom:5px;z-index:5000;{block:ifsmallimages}width:500px;{/block:ifsmallimages}}
.header {margin:auto;width:500px;{block:ifsmallimages}width:500px;{/block:ifsmallimages}background-color:{color:background};
}
 
.tumblrAutoPager_page_info, .tumblrAutoPager_page_separator {display:none;}
#infscr-loading {opacity:0;}
 
.navigation{{block:ifendlessscroll}display:none;{/block:ifendlessscroll}{block:ifnotendlessscroll}position:fixed;bottom:0px;margin-left:550px;{block:ifsmallimages}margin-left:410px;{block:ifsmallimages}font-style:italic;{/block:ifnotendlessscroll}}
{CustomCSS}
</style>
 
 
{block:ifendlessscroll}<script type="text/javascript" src="http://static.tumblr.com/q0etgkr/J5bl3lkz1/tumblrautopagernopage.js"></script>{/block:ifendlessscroll}
</head>
 
<body>
<div class="header">
{block:description}{description}{/block:description}<div style="text-align:right;font-style:italic;"><a href="/ask">contact</a>&nbsp;<a href="/archive">archive</a>&nbsp;{block:HasPages}{block:Pages}<a href="{URL}">{Label}</a>&nbsp;{/block:Pages}{/block:HasPages}</div>
 
<div class="content">
<div class="blogtitle"><a href="/">{Title}</a></div>
{block:ifnotendlessscroll}<div class="navigation">{block:Pagination}{block:NextPage}<p id="page_nav"><a href="{NextPage}" id="next">older</a>{/block:NextPage}{block:PreviousPage}<a href="{PreviousPage}"> // newer</a></p>{/block:PreviousPage}{/block:Pagination}</div>{/block:ifnotendlessscroll}
{block:ifendlessscroll}<div class = "autopagerize_page_element">{/block:ifendlessscroll}{block:Posts}
 
{block:Text}
<div class="post">
{block:Title}<div class="title">{Title}</div>{/block:Title}
{Body}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>
{/block:IndexPage}
 
{block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
Posted {TimeAgo} with {NoteCount} Notes 
{block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
 
<div class="notes">
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
{/block:PermalinkPage} 
 
</div>
{/block:Text}
 
 
{block:Photo}
<div class="post"align="center">
{block:ifphotoinformation}
<div class="photoinfo">{NoteCountWithLabel}<br>{block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
{/block:ifphotoinformation}
 
{block:IndexPage}
<a href="{Permalink}">
<img src="{PhotoURL-500}" alt="{PhotoAlt}" />
{block:ifshowcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}{/block:IndexPage}</a>
 
{block:PermalinkPage}
<img src="{PhotoURL-500}" alt="{PhotoAlt}" width="500"/><div class="notetitle">{block:caption}{Caption}{/block:caption}
Posted {TimeAgo} with {NoteCount} Notes 
{block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
 
<div class="notes">
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
{/block:PermalinkPage}
 
 
</div>
{/block:Photo}
 
 
{block:Photoset}
<div class="post">
{block:ifnotsmallimages}{Photoset-500}{/block:ifnotsmallimages}{block:ifsmallimages}{photoset-500}{/block:ifsmallimages}
{block:ifshowcaptions}{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}
{/block:IndexPage}
 
{block:IndexPage}<div class="permalink"><a href="{Permalink}"><br>{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>{/block:IndexPage}
 
{block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
Posted {TimeAgo} with {NoteCount} Notes 
{block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
 
<div class="notes">
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
{/block:PermalinkPage} 
</div>
 
{/block:Photoset}
 
{block:Quote}
<div class="post">
{Quote}{block:Source}<br>written by <i>{Source}</i>{/block:Source}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>{/block:IndexPage}
{block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
Posted {TimeAgo} with {NoteCount} Notes 
{block:HasTags}{block:Tags}<a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
 
<div class="notes">
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
{/block:PermalinkPage} 
</div>
{/block:Quote}
 
{block:Link}
<div class="post">
<div class="title"><a href="{URL}">{Name}</a></div>
{block:Description}{Description}{/block:Description}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>
{/block:IndexPage}
</div>
{/block:Link}
 
{block:Chat}
<div class="post">
{block:Title}<b>{Title}</b>{/block:Title}
{block:Lines}{block:Label}<b>{Label}</b> "{Line}"<br>{/block:Label}{/block:Lines}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a></div>
{/block:IndexPage}
{block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
Posted {TimeAgo} with {NoteCount} Notes 
{block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
 
<div class="notes">
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
{/block:PermalinkPage} 
</div>
{/block:Chat}
 
{block:Video}
<div class="post">
{block:ifnotsmallimages}{video-500}{/block:ifnotsmallimages}{block:ifsmallimages}{video-400}{/block:ifsmallimages}
{block:Caption}<div class="caption">{Caption}</div>{/block:Caption}{/block:ifshowcaptions}
</div>{/block:Video}
 
{block:Audio}
<div class="post">
<div class="audio">
{AudioPlayerBlack}</div>
{Caption}
{block:IndexPage}<div class="permalink"><a href="{Permalink}">{ShortMonth} {DayOfMonth}{DayOfMonthSuffix}</a>
</div>{/block:IndexPage}
{block:permalinkpage}<div class="notetitle">{block:caption}{Caption}{/block:caption}
Posted {TimeAgo} with {NoteCount} Notes 
{block:HasTags}{block:Tags}<br><a href="{TagURL}">#{Tag}&nbsp;</a>{/block:Tags}{/block:HasTags}</div>
 
<div class="notes">
{block:PostNotes}{PostNotes}{/block:PostNotes}</div>
{/block:PermalinkPage} 
</div>
{/block:Audio}
 
 
 
 
{/block:Posts}
 
</div>
</body>
</html>

AttachmentSize
Screen shot 2014-02-14 at 7.17.42 PM.png49.95 KB
helldog2004
helldog2004's picture
Offline
Enthusiast
Netherlands
Last seen: 4 years 45 weeks ago
Netherlands
Timezone: GMT+2
Joined: 2014-03-02
Posts: 205
Points: 239

Is there a way for you to

Is there a way for you to post your URL in here so we can take a look into the website ourselves?

Check Maximum Webdesign for your online solutions