如何將圖標放在標題旁邊？

我一直在寫一個網站，我有一個小的，我想修復的整容錯誤。如何將圖標放在標題旁邊？

這是代碼

HTML

<div id="page"> 

    <ul id="icons"> 
     <li><object type="image/svg+xml" data="images/pl.svg"></object></li> 
     <li><object type="image/svg+xml" data="images/gb.svg"></object></li> 
    </ul> 
    <div style="clear: both;"></div> 
    <header> 
     RYSZARD KUKLIŃSKI 
    </header> 
</div>

CSS

header { 
    font-family: 'Poppins', sans-serif; 
    font-size: 1.688em; 
    text-align: center; 
    font-weight: 700; 
    display: block; 
    letter-spacing: 1px; 

    margin-left: auto; 
    margin-right: auto; 
    max-width: 40%; 
    border-radius: 5px; 
    margin-top: 10px; 
    background-color: #e60000; 
    padding-top: 10px; 
    padding-bottom: 10px; 

    border: 5px solid #a20000; 
} 
#icons { 
    list-style: none; 

    margin: 0; 
    padding: 0; 
    float: right; 

    margin-top: 10px; 
    margin-right: 5px; 
} 
#icons li { 
    display: inline-block; 
} 
object { 
    height: 16px; 
    width: 32px; 

}

您還可以看到的東西真人版我這裏講：www.ryszardkuklinski.pl（保持考慮到該網站仍處於開發階段，並且尚未發佈），或者即將發佈以下ae照片：

Photo of preview

問題是與這些圖標：波蘭國旗和英國在右上角。這些圖標放在標題上方，我不能讓它們放在標題旁邊。我的意思是相同的水平，不是在它下面，而不是在上面。我希望你能理解我。我正在等待回覆:)通常，這些圖標的目的是用不同的語言重定向到網站。

來源

2017-03-03 Karol Zientek

嘗試絕對定位標誌 - 使'＃頁面'相對和'#icons {position：absolute;頂部：10px;右：爲5px; }'並從圖標上刪除邊距 – Pete

使用下面的代碼：

<head> 
     <link rel="shortcut icon" href="url of image" type="image/ico" /> 
</head>

來源

2017-03-03 12:50:19

它不起作用。我的意思是用作國旗的矢量圖像。看看上面的照片，有兩個國家的國旗將被認爲是將用戶重定向到另一種語言的網站。問題是，這些國家的國旗或圖標讓我們說不像HTML中的「標題」標籤那樣處於相同的級別。這些標誌高於標題的級別，這就是事情。我希望這些國家的國旗像頭一樣的水平。我希望你能抓住我的偏見。 –

請與下面的款式更新在CSS的ID '#icons'。

#icons { 
    position: absolute;  
    right: 0; 

    list-style: none; 
    margin: 0; 
    padding: 0; 
    float: right; 
    margin-top: 10px; 
    margin-right: 5px; 
}

來源

2017-03-03 14:23:08

正確。並刪除「浮動：正確」 – Johannes

如何將圖標放在標題旁邊？

回答

相關問題