Tumblr主題：ul，il間距問題？

我正在創建一個Tumblr主題來處理我的CSS和HTML能力，並且遇到了問題。Tumblr主題：ul，il間距問題？

http://cl.ly/3c0q3X3a0A193z1u2u2V - 照片後期

正如你可以從上面的圖片中看到，文字似乎本身飛奔下來，沒有任何其他代碼與照片它總是在正確的位置。

我對這種事情仍然處於起步階段，所以我不確定該怎麼做。

這裏是我的CSS和HTML：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 

<ul class="header"> 
    <li><a href="/"><h1>{Title}</h1></a> 
    <li><a href="/about">About</a> 
    <li><a href="/message">Message</a> 
    <li><a href="/archive">Archive</a> 
</ul> 

<ul class="content"> 
    {block:Posts} 
    {block:Text} 
     <li class="text_post"> 
      {block:Title} 
        <h3><a href="{Permalink}">{Title}</a></h3> 
       {/block:Title} 
      {Body} 
     </li> 
    {/block:Text} 
    {block:Photo} 
     <li class="photo_post"> 
      <img src="{PhotoURL-500}"> 
     </li> 
    {/block:Photo} 
{/block:Posts} 
</ul> 

<style type="text/css"> 
body { 
    font-family:Georgia, times, serif; 
    font-size:0.7em;} 
h1 { 
    display:inline; 
    font-family:'Lucida Grande', Arial, sans-serif; 
    font-size:100%; 
    color:#00C462; } 
ul, ol { 
    list-style-type:none; 
    margin:0; 
    padding:0;} 
.header { 
    position:fixed; 
    margin-top:1em;} 
.header li { 
    float:left; 
    padding-left:1em;} 
.header li a, a:visited { 
    color:#000000; 
    font-family:'Lucida Grande', Arial, sans-serif; 
    text-decoration:none;} 
.header li a:hover { 
    color:#CCCCCC;} 
.content { 
    float:left; 
    overflow:auto; 
    margin-top:1.3em; 
    width:500px; 
    margin-left:23em;} 
</style>

另外，如果你對我如何能提高我的代碼有什麼建議，請分享。

感謝你的幫助，

來源

2012-04-26 user1357639

你能提供一個鏈接到網頁？我有預感，但想檢查代碼;截圖本身不會削減它。 – kopischke 2012-05-07 19:35:45

它看起來像你對我只是缺少.header寬度...

的。內容UL應該再上浮很好旁邊。

你只需要計算你的容器的內容。如...

#container { 
    width:800px; for example 
    } 
.header { 
    width:300px; 
    float:left; 
    } 
.content { 
    width:500px; 
    float:left; 
    }

希望這有助於...

來源

2012-04-26 03:51:00 Palle

可悲的是，這並沒有改變... – user1357639 2012-04-26 20:14:51

首先，明確設置你的H3的保證金和填充爲0，然後寫相應的規則增加保證金/填充到h3的底部。

二，你爲什麼不分別將漂浮標題&的內容類別左移&？以下是我正在處理的主題的鏈接 - El Aleph。我正在做一些與我的博客標題和內容類似的內容。我剛剛將我的標題向左和我的內容右移。隨意看看我的主題的CSS。

此外，爲什麼你使用ULs塊級內容？最好的辦法是要麼使用的DIV，用於把內容塊或使用HTML5元素，如標題，文章等

來源

2012-05-16 07:19:53

Tumblr主題：ul，il間距問題？

回答

相關問題