定位一个离开一边的元素？

Question

我正在尝试使“FlowerPot”文本居中对齐，但它不起作用。我不知道为什么。也许这是令人发疯的<code>元素，但我不认为这会有所作为。这是我的代码：

@import url(http://fonts.googleapis.com/css?family=Lobster+Two:400,400italic); 
 
body { 
 
    width: 100%; 
 
    background-color: #B10DC9; 
 
    overflow-x: scroll; 
 
    right: 0; 
 
} 
 
img { 
 
    padding-left: 10px; 
 
    width: 50px; 
 
    z-index: 0; 
 
    float: left; 
 
} 
 
code { 
 
    position: absolute; 
 
    top: 0; 
 
    color: white; 
 
    z-index: 0; 
 
    float: left; 
 
    width: 100%; 
 
} 
 
#introdiv { 
 
    background-color: blue; 
 
    text-align: center; 
 
    width: 100%; 
 
    padding: 0px; 
 
    position: fixed; 
 
    z-index: 0; 
 
}

<div id="introdiv"> 
 
    <img src="http://cakestyle.tv/wp-content/uploads/2013/03/Flower-Pot-no-background-smaller.png"></img> 
 
    <code style="font-family:Lobster Two; font-size:60px;">FlowerPot</code> 
 
</div>

请帮忙。我不知道我做错了什么。我需要添加或删除一些东西吗？我需要改变什么吗？

任何帮助，将不胜感激。谢谢！

Answer 1

添加left:0到code

code { 
    position: absolute; 
    top: 0; 
    color: white; 
    z-index: 0; 
    float: left; 
    width: 100%; 
    left: 0; 
} 

Answer 2

修改选择code风格，并添加left: 0;风格。你可以得到你的结果。