blooom

Редактирование шапки в жж

Привет. Ковыряюсь пятый день с дизайном темы для жж, но понял, что без вашей помощи не справлюсь. В шапке нужно поменять шрифт темы журнала, нужный заголовок сделал в виде картинки и никак не могу его прикрепить вместо текста. Над названием нужно поместить еще одну картинку. Это все, но повторюсь не как не получается задуманное, выходит все кроме того что нужно. Буду безмерно благодарен, если сможете подсказать, как подправить код. Вот код тайтла. .header-title { background:url("http://i29.tinypic.com/ne6hl0.jpg") no-repeat scroll 50% 0 transparent; font-family:Georgia; font-size:60px; line-height:60px; margin:0 auto; padding-top:35px; text-align:center; text-transform:uppercase; width:700px; } нужно чтобы получилось как на картинке здесь тема Smooth Sailing и весь ее код

April 5, 2011

Выравнивание текста в блоке

blooom posted a question in HTML Coding

Доброго всем времени суток. Завел себе блог на tumblr.com, хороший ресурс но со своими косяками. Больше всего меня беспокоит отсутствие в редакторе выравнивания текста, поэтому приходится задавать параметры в коде шаблона. Еще одна особенность данного сервиса, постинг разбит на категории (текст, фото, цитата и тп.) и каждый блок имеет свои особенности. Так вот, хочу попросить вашей помощи для выравнивания текста в блоке цитата по правому краю. Сейчас текст всех блоков выравнивается по центру, это мне подходит, но в блоке цитата нужно выравнивать по правому краю, помучался но та не чего и не получилось, все-таки знаний html не хватает. Буду очень благодарен за помощь. Вот ссылка на блог Вот актуальный код <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>{Title}{block:PostSummary} | {PostSummary}{/block:PostSummary}{block:SearchPage} | {lang:Search results for SearchQuery}{/block:SearchPage}</title> <meta name="description" content="{MetaDescription}" /> <meta name="if:Show description" content="1" /> <meta name="if:Show search" content="1" /> <meta name="text:Twitter name" content="" /> <meta name="text:Disqus Shortname" content="" /> <meta name="text:Google Analytics ID" content="" /> <link rel="shortcut icon" href="{Favicon}" /> <link rel="alternate" type="application/rss+xml" title="{Title}" href="{RSS}" />  <link rel="stylesheet" href="http://static.tumblr.com/f1whv92/Mp9l6ewcg/reset.css" /> <style type="text/css"> /*—-- GENERAL —--*/ header, footer, section, article, nav, aside { display: block; } body { background: #ffffff; color: #222; font: 12px/20px Georgia, "Times New Roman", Times, serif; padding-top: 25px; text-align: center; width:800px; margin: 0 auto; } .disphoto { background-image: url({PortraitURL-64}); -moz-border-radius: 64px; -webkit-border-radius: 64px; width: 64px; height: 64px; margin: 25px; } h1, h2, h3, hQ { font-family: Cufon; } h1 { font-size: 50px; line-height: 50px; } h2 { font-size: 31px; line-height: 37px; } h3 { font-size: 21px; line-height: 27px; } a:link, a:visited { color: #222222; font-style: italic; font-weight: normal; text-decoration: none; } a:hover, a:active { text-decoration: underline; } hr{ border:0 #ccc solid; border-top-width:1px; clear:both; height:0; } ol{list-style:decimal} ul{list-style:disc} li{margin-left:30px} p,dl,hr,h1,h2,h3,h4,h5,h6,ol,ul,pre,table,address,fieldset{margin-bottom:15px} #main { padding: 0px; } /*—-- MASTHEAD —--*/ .noMeta > div { padding: 0px; } #masthead { margin-bottom: 0px; } #masthead h1 { margin-bottom: 0; } #masthead h1 a:link, #masthead h1 a:visited { text-transform: Uppercase; color: #222; text-decoration: none; } #masthead h1 a:active { outline: 0; } #masthead p { font-family: Georgia, serif; font-size: 20px; color: #fff; margin-bottom: 0; } #masthead a:link, #masthead a:visited { color: #fff; } #siteDescription{ font-size: 13px; color: #222; text-transform: Uppercase; border-top: 1px solid #222; margin-top: 20px; margin-bottom: -5px; padding: 15px 0 0 0; font-family: Cufon; } /*—-- SEARCH FORM —--*/ #frmSearch { padding-top: 20px; display: none; } #txtSearch { background: url(http://static.tumblr.com/bpryy0m/6lRl6gmys/search.jpg) left no-repeat; width: 225px; padding: 2px 0 0 20px; font: 12px/12px Georgia, "Times New Roman", Times, serif; color: #222; border: 0px; } /*—-- MAIN HEADER NAV STRIP —--*/ #mainNav { border-top: 1px solid #222; border-bottom: 2px solid #222; margin-top: 20px; padding: 15px; font-family: Cufon; } #mainNav ul { list-style: none; margin: 0; padding: 0; } #mainNav li { margin: 5px; display: inline; padding: 0; } #mainNav a:link, #mainNav a:visited { padding: 0; font-size: 12px; line-height: 14px; margin: 0 2px; text-decoration: none; color: #222; text-transform: Uppercase; } #mainNav a:hover, #mainNav a:active { outline: none; text-decoration: none; border-bottom: 1px solid #222; } #mainNav a.active { text-decoration: none; border-bottom: 1px solid #222; } /*—-- ARTICLE META INFO —--*/ #designline { margin-top: 50px; } h5{ position: relative; top: -35px; margin-bottom: 0px; font-family: Georgia, serif; font-size: 10px; color: #bca474; text-decoration: none; text-transform: Uppercase; font-weight: bold; border-bottom: 1px solid #bca474; background: #fff; } h5 a:link, .line a:visited{ font-family: Georgia, serif; font-size: 10px; color: #bca474; text-decoration: none; text-transform: Uppercase; font-weight: bold; } h5 a:hover{ text-decoration: underline; } h5 abbr{ display: inline-block; position: relative; margin: 0 auto; padding: 0 8px; background: #fff; top: 10px; } h5.postDate a{ color: #bca474; } /*—-- ARTICLE —--*/ article { background: #fff; margin-bottom: 20px; text-align: auto; position: relative; } article img { border: none; margin-bottom: 15px; max-width: 800px; } article p img { margin: 0; } article > div { padding: 0px; overflow: hidden; } article .searchPage { margin: 35px 0 0 0; } .searchPageText { margin: 0 0 30px 0; } article .meta a:link, article .meta a:visited { text-decoration: none; } article .meta a:hover, article .meta a:active { text-decoration: underline; } article h2 { text-align: center; color: #222222; } article h2 a:link, article h2 a:visited { text-transform: Uppercase; color: #222; text-decoration: none; } article h2 a:hover, article h2 a:active { text-decoration: none; border-bottom: 1px solid #222; } blockquote { border-right: 2px solid #bca474; margin-right: 200px; padding-right: 1em; } #quoteSource{ margin: 0 auto; text-align: right; } #quoteText h5 { text-align: right; color: #222222; } article .chat { list-style: none; padding: 0; margin: 0; } article .chat li { margin: 0 0 2px; padding: 2px 0 2px 0; } .photoCaption { text-align: center; } /*—-- AUDIO PLAYER —--*/ .audio { height: 28px; width: 26px; overflow: hidden; margin: auto; padding-top: 7px; } .audioc { background-image:url('http://static.tumblr.com/f1whv92/9iCl6bfgp/audiocircle.png'); background-repeat: no-repeat; height: 41px; width: 41px; } .audioCaption { margin-top: 1px; } .audioleft { width: 41px; float: left; } .audioright { width: 760px; float: center; } .audioContainer { margin-top: 5px; } .audioClear { clear:both; } /*—-- ARTICLE NOTES —--*/ .notes { border-top: 1px solid #bca474; list-style: none; padding: 20px 0 5px 0; margin: 30px 0 0 0; } .notes li { margin: 0; } .notes .avatar { margin: 0 5px 0 0; position: relative; top: 5px; } .notes blockquote { margin: 10px 0 0 35px; padding-left: 10px; border-left: 2px solid #222222; } .media { width: 800px; margin-bottom: 20px; } /*—-- PAGE NAVIGATION —--*/ #pageNav { margin-top: 20px; border-top: 1px solid #222; } #pageNav ul { list-style: none; padding: 10px 15px; margin: 10px 0; } #pageNav li { margin: 0; display: inline; } #pageNav a:link, #pageNav a:visited { font: 11px Georgia, "Times New Roman", Times, serif; padding: 0; margin: 0 2px; background: #34hdf5; color: #222; text-decoration: none; } #pageNav a:hover, #pageNav a:active, #pageNav a.active:link, #pageNav a.active:visited { text-decoration: underline; } #pageNavOlder:after { content: " »"; font-size: 10px; } #pageNavNewer:before { content: "« "; } /*—-- FOOTER META —--*/ #sitemeta { border-top: 2px solid #222; color: #222; padding: 20px 0 32px 0; font-family: Georgia, "Times New Roman", Times, serif; font-size: 8px; } #sitemeta p { margin: 0; } #sitemeta a:link, #sitemeta a:visited { color: #222; font-weight: bold; } {CustomCSS} </style>   <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script src="http://static.tumblr.com/q9z1v7k/dgEkijh8r/cufon-yui.js" type="text/javascript"></script> <script src="http://static.tumblr.com/f1whv92/fgIl65bo1/cufon_300.font.js" type="text/javascript"></script> <script type="text/javascript"> Cufon.replace('h1',{ fontFamily: "Cufon" }); Cufon.replace('h2',{ fontFamily: "Cufon" }); Cufon.replace('h3',{ fontFamily: "Cufon" }); Cufon.replace('#mainNav',{ fontFamily: "Cufon" }); Cufon.replace('#siteDescription',{ fontFamily: "Cufon" }); </script> <script> $(function() { var search = $("#txtSearch").val(); var placeholder = "Search..."; var fadeToOpacity = 0.4; $("#txtSearch").fadeTo("normal", fadeToOpacity); if (search == "") { $("#txtSearch").val(placeholder); } $("#txtSearch").blur(function() { search = $("#txtSearch").val(); if (!(search != "" && search != placeholder)) { $("#txtSearch").val(placeholder); } $("#txtSearch").fadeTo("normal", fadeToOpacity); }); $("#txtSearch").focus(function() { search = $("#txtSearch").val(); if (search == placeholder) { $("#txtSearch").val(""); } $("#txtSearch").fadeTo("normal", 1); }); $("#btnSearch").click(function() { $("#frmSearch").slideToggle("normal"); $(this).toggleClass("active"); // $("#txtSearch").focus(); }); }); </script> </head> <body> <center><div class="disphoto"></div></center> <header id="masthead" class="clearfix"> <div id="thehead"> <h1 class="cufon"><a href="/">{Title}</a></h1> <form action="/search" method="get" id="frmSearch"> <input type="text" id="txtSearch" name="q" value="{SearchQuery}" /> </form> {block:Description} <div id="siteDescription">{Description}</div> {block:Description} <nav id="mainNav"> {block:HasPages} {block:Pages}<li><a href="{URL}">{Label}</a></li>{block:Pages} {/block:HasPages} {block:IfTwitterName} <li><a href="http://twitter.com/{text:Twitter name}">Twitter</a></li> {/block:IfTwitterName} {block:AskEnabled}<li><a href="/ask">Ask</a></li>{/block:AskEnabled} {block:SubmissionsEnabled}<li><a href="/submit">Submit</a></li>{/block:SubmissionsEnabled} <li><a href="{RSS}">RSS</a></li> <li><a href="java script:;" id="btnSearch">Search</a></li> </nav> </div> </header> <section id="main" class="clearfix"> <div class="layout"> {block:SearchPage} <article> <div> <div class="searchPage"> <h2>Search results for <a href="{URLSafeSearchQuery}">{SearchQuery}</a></h2> </div> {block:NoSearchResults} <div class="searchPageText"> <p>I’m sorry, but we couldn't find anything matching "<b>{SearchQuery}</b>". Suggestions:</p> <ul> <li>Make sure all words are spelled correctly.</li> <li>Try different keywords.</li> <li>Try more general keywords.</li> </ul> </div> {/block:NoSearchResults} </div> </article> {/block:SearchPage} {block:TagPage} <article> <div> <div class="searchPage"> <h2>Posts tagged <a href="{TagURL}">{Tag}</a></h2> </div> </div> </article> {/block:TagPage} {block:Posts} <div id="designline"> <h5 class="postDate"> <abbr>{block:Date}<a href="{Permalink}">{DayOfMOnth}{DayOfMonthSuffix} {ShortMonth} {Year}</a>{/block:Date}{block:NoteCount} | <a href="{Permalink}#notes">{NoteCountWithLabel}</a>{/block:NoteCount} </abbr> </h5> </div> <article> <div> {block:Text} {block:Title}<h2><a href="{Permalink}">{Title}</a></h2>{/block:Title} {Body} {/block:Text} {block:Photo} {LinkOpenTag}<img src="{Photo-HighRes}" alt="{PhotoAlt}" />{LinkCloseTag} {block:Caption}<div class="photoCaption">{Caption}</div>{/block:Caption} {/block:Photo} {block:Photoset} <div class="media">{Photoset-500}</div> {block:Caption}<div class="caption">{Caption}</div>{/block:Caption} {/block:Photoset} {block:Quote} <div id="quoteText"><h7>{Quote}</h7></div> {block:Source}<div id="quoteSource"><p>—{Source}</p></div>{/block:Source} {/block:Quote} {block:Link} <h2><a href="{URL}" {Target}>{Name}</a></h2> {block:Description} <div>{Description}</div> {/block:Description} {/block:Link} {block:Chat} {block:Title}<h2>{Title}</h2>{/block:Title} <ul class="chat"> {block:Lines} <li>{block:Label}<strong>{Label}</strong>{/block:Label} {Line}</li> {/block:Lines} </ul> {/block:Chat} {block:Audio} <div class="audioleft"> <div class="audioc"> <div class="audio">{AudioPlayerBlack}</div> </div> </div> <div class="audioright"> <div class="audioCaption">{block:Artist}<b>{Artist}</b>{/block:Artist} <p>{block:TrackName}{TrackName}{/block:TrackName}</p> </div> </div> <div class="audioClear"></div> <div class="audioContainer"> {block:Caption}{Caption}{/block:Caption} </div> {/block:Audio} {block:Video} <div class="media">{Video-500}</div> {block:Caption}<div>{Caption}</div>{/block:Caption} {/block:Video} {block:Answer} <h5>{Asker} asked: {Question}</h5> {Answer} {/block:Answer} {block:Date} {block:IfDisqusShortname} <script type="text/javascript"> //<![CDATA[ (function() { var links = document.getElementsByTagName('a'); var query = '?'; for(var i = 0; i < links.length; i++) { if(links[i].href.indexOf('#disqus_thread') >= 0) { query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&'; } } document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/{text:Disqus Shortname}/get_num_replies.js' + query + '"></' + 'script>'); })(); //]]> </script> {/block:IfDisqusShortname} {block:PostNotes} {PostNotes} {/block:PostNotes} {block:Date} </div> </article> {/block:Posts} {block:PermalinkPagination} <nav id="pageNav"> <ul class="clearfix"> {block:PreviousPost}<li><a href="{PreviousPost}" id="pageNavNewer">Previous</a></li>{/block:PreviousPost} {block:NextPost}<li><a href="{NextPost}" id="pageNavOlder">Next</a></li>{/block:NextPost} </ul> </nav> {/block:PermalinkPagination} {block:Pagination} <nav id="pageNav"> <ul class="clearfix"> {block:PreviousPage}<li><a href="{PreviousPage}" id="pageNavNewer">Newer</a></li>{/block:PreviousPage} {block:JumpPagination length="5"} {block:CurrentPage}<li><a href="{URL}" class="active">{PageNumber}</a></li>{/block:CurrentPage} {block:JumpPage}<li><a href="{URL}">{PageNumber}</a></li>{/block:JumpPage} {/block:JumpPagination} {block:NextPage}<li><a href="{NextPage}" id="pageNavOlder">Older</a></li>{/block:NextPage} </ul> </nav> {/block:Pagination} {block:DayPagination} <nav id="pageNav"> <ul class="clearfix"> {block:PreviousDayPage}<li><a href="{PreviousDayPage}">« {DayOfMonth} {ShortMonth}</a></li>{/block:PreviousDayPage}{block:NextDayPage}|<li><a href="{NextDayPage}">{DayOfMonth} {ShortMonth} »</a></li>{block:NextDayPage} </ul> </nav> {/block:DayPagination} </div> </section> <footer id="sitemeta"> <div class="clearfix"> <div class="thefooter"> <p><a href="http://www.tumblr.com/theme/12051">The Minimalist Theme</a> designed by <a href="http://minimalist.co">The Minimalist</a> | Powered by <a href="http://tumblr.com">Tumblr</a></p> </div> </div> </footer> {block:IfGoogleAnalyticsID} <script type="text/javascript">var gaJsHost=(("https:"==document.location.protocol)?"https://ssl.":"http://www.");document.write(unescape("%3Cscript src='"+gaJsHost+"google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));</script><script type="text/javascript">try{var pageTracker=_gat._getTracker("{text:Google Analytics ID}");pageTracker._trackPageview()}catch(err){}</script> {block:IfGoogleAnalyticsID} </body> </html>

Sign In

Posts

Joined

Last visited

blooom's Achievements

Explorer (1/14)

Reputation

Редактирование шапки в жж

Выравнивание текста в блоке

Какой код использовать?

Какой код использовать?

Какой код использовать?

Какой код использовать?

Forums

Important Information