Forum Mjukvara Programmering och digitalt skapande Tråd Inlägg

Hjälp med css (simpelt).

1
Skriv svar
Permalänk
Medlem
●

Hjälp med css (simpelt).

Tja!

Har lite problem med min blogg då bilderna som laddas upp inte blir centrerade. Går det att ställa in så att dom blir centrerade automatiskt?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!--
     Theme: The Minimalist v1.
     Design: The Minimalist (http://minimalist.co)
-->

<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}" />

<!-- Styles -->

<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:500px;
        margin: 0 auto;
     }

     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-weight: bold;
        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: 14px;
        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: left;
       position: relative;
      }

     article img {
        border: none;
        margin-bottom: 15px;
        max-width: 500px;
     }

     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-left: 2px solid #bca474;
        margin-left: 0;
        padding-left: 1em;
     }

     #quoteSource{
        margin: 0 auto;
        text-align: left;
     }

     #quoteText h2 {
        text-align: left;
        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: 444px;
        float: right;
      }

     .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: 500px;
        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: 11px;
     }

     #sitemeta p {
        margin: 0;
     }

     #sitemeta a:link, #sitemeta a:visited {
        color: #222;
        font-weight: bold;
     }

{CustomCSS}
</style>

<!-- Scripts -->

<!--[if IE="IE"]>
     <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min...."></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>

     <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:AskEnabled}<li><a href="/ask">Ask</a></li>{/block:AskEnabled}
              {block:SubmissionsEnabled}<li><a href="/submit">Submit</a></li>{/block:SubmissionsEnabled}                 
              <li><a href="/archive">Archive</a></li>
              <li><a href="/random">Random</a></li>
              <li><a href="{RSS}">RSS</a></li>
              <li><a href="javascript:;" id="btnSearch">Search</a></li>
              {block:IfTwitterName}
              <li><a href="http://twitter.com/{text:Twitter name}">Twitter</a></li>
              {/block:IfTwitterName}
           </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="{PhotoURL-500}" 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"><h2>{Quote}</h2></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}
             <h3>{Asker} asked: {Question}</h3>
             {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><!-- END layout -->
     </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>
Dold text
Senast redigerat
Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av AIIN:

Tja!

Har lite problem med min blogg då bilderna som laddas upp inte blir centrerade. Går det att ställa in så att dom blir centrerade automatiskt?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<!--
     Theme: The Minimalist v1.
     Design: The Minimalist (http://minimalist.co)
-->

<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}" />

<!-- Styles -->

<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:500px;
        margin: 0 auto;
     }

     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-weight: bold;
        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: 14px;
        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: left;
       position: relative;
      }

     article img {
        border: none;
        margin-bottom: 15px;
        max-width: 500px;
     }

     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-left: 2px solid #bca474;
        margin-left: 0;
        padding-left: 1em;
     }

     #quoteSource{
        margin: 0 auto;
        text-align: left;
     }

     #quoteText h2 {
        text-align: left;
        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: 444px;
        float: right;
      }

     .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: 500px;
        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: 11px;
     }

     #sitemeta p {
        margin: 0;
     }

     #sitemeta a:link, #sitemeta a:visited {
        color: #222;
        font-weight: bold;
     }

{CustomCSS}
</style>

<!-- Scripts -->

<!--[if IE="IE"]>
     <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

     <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min...."></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>

     <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:AskEnabled}<li><a href="/ask">Ask</a></li>{/block:AskEnabled}
              {block:SubmissionsEnabled}<li><a href="/submit">Submit</a></li>{/block:SubmissionsEnabled}                 
              <li><a href="/archive">Archive</a></li>
              <li><a href="/random">Random</a></li>
              <li><a href="{RSS}">RSS</a></li>
              <li><a href="javascript:;" id="btnSearch">Search</a></li>
              {block:IfTwitterName}
              <li><a href="http://twitter.com/{text:Twitter name}">Twitter</a></li>
              {/block:IfTwitterName}
           </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="{PhotoURL-500}" 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"><h2>{Quote}</h2></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}
             <h3>{Asker} asked: {Question}</h3>
             {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><!-- END layout -->
     </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>
Dold text
Gå till inlägget

gaaah, kan inte hjälpa dig. Men kan tipsa om att göra

en spoiler!

Dold text

EDIT: Jag kanske borde göra det också

Senast redigerat
Visa signatur

"En dator"

Redigera
Citera flera Citera
Permalänk
Medlem
●
Skrivet av ohoy:

gaaah, kan inte hjälpa dig. Men kan tipsa om att göra

en spoiler!

Dold text
Gå till inlägget

Såja lugn och fin! Det är fixat.

Redigera
Citera flera Citera
Permalänk
Medlem
●

Du får specifiera var i koden dina bildinställningar ligger. Antar att det handlar om Article-delen?
Jag brukar köra på margin-left: auto; och margin-right: auto;

Visa signatur

Citera för svar!

i5 2500k @ 4.6 GHz - 2x HD6950@CF - 8 GB CL8 VENGEANCE @ 1866 MHz

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av AIIN:

Tja!

Har lite problem med min blogg då bilderna som laddas upp inte blir centrerade. Går det att ställa in så att dom blir centrerade automatiskt?

Gå till inlägget

Förstår inte varför människor envisas med att fråga om saker de tycker är simpla, men om du vill att dina bilder ska bli centrerade så lägg dem inuti ett element som har text-align:center satt.

Visa signatur

Kom-pa-TI-bilitet

Redigera
Citera flera Citera
Permalänk
Entusiast
●

Något i denna stilen borde funka:

Lägg till i cssen:

.center_image{
	width: 500px;
	margin: 0 auto;
}

Ändra i htmlen:

{block:Photo} 
	<div class="center_image">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{LinkCloseTag}</div>
	{block:Caption}<div class="photoCaption">{Caption}</div>{/block:Caption} 
{/block:Photo}

Du kanske får göra lika dant på photoset, jag är inte så insatt i vilka element som gör vad i tumblrs system.

Förklara gärna för mig vad det är jag har gjort så att jag ser att du förstår, annars lär du dig ju inget (Kanske ska testa så att det fungerar först dock)

Visa signatur

Mörkt tema till sweclockers | Taklampa med socket 1155

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av Blargmode:

Något i denna stilen borde funka:

Lägg till i cssen:

.center_image{
	width: 500px;
	margin: 0 auto;
}

Ändra i htmlen:

{block:Photo} 
	<div class="center_image">{LinkOpenTag}<img src="{PhotoURL-500}" alt="{PhotoAlt}" />{LinkCloseTag}</div>
	{block:Caption}<div class="photoCaption">{Caption}</div>{/block:Caption} 
{/block:Photo}

Du kanske får göra lika dant på photoset, jag är inte så insatt i vilka element som gör vad i tumblrs system.

Förklara gärna för mig vad det är jag har gjort så att jag ser att du förstår, annars lär du dig ju inget (Kanske ska testa så att det fungerar först dock)

Gå till inlägget

Det kommer inte fungera; blocket centreras men om bilden är 10px bred kommer den lägga sig till vänster i det centrerade blocket. (om den är bredare kommer den sticka ut genom sidan av blocket istället.)

Visa signatur

Kom-pa-TI-bilitet

Redigera
Citera flera Citera
Permalänk
Medlem
●

#designline .img {
text-align: center;
}

eller?

Redigera
Citera flera Citera
Permalänk
Medlem ★
●
Skrivet av HeeK:

#designline .img {
text-align: center;
}

eller?

Gå till inlägget

#designline innehåller inte några bilder och inget element med klass .img heller. Svaret står några poster upp..

Visa signatur

Kom-pa-TI-bilitet

Redigera
Citera flera Citera
Permalänk
Medlem
●

/*----- ARTICLE -----*/

article {
background: #fff;
margin-bottom: 20px;
text-align: left;
position: relative;
}

article img {
border: none;
margin-bottom: 15px;
max-width: 500px;
}

article p img {
margin: 0;
}
article > div {
padding: 0px;
overflow: hidden;
..........
osvosvosv

för fotoset styla classen "media"

Senast redigerat
Redigera
Citera flera Citera
1
Skriv svar
Senaste nyheterna
Hårdvara
Mjukvara
Övrigt
Nytt i forumet
Datorkomponenter
System
Ljud, bild och kommunikation
Spel och mjukvara