使标题适合屏幕宽度

时间:2014-06-13 22:23:50

标签: html css

现在,我的标题在屏幕上看起来不错,但它会像标题太宽一样滚动,如果这有意义的话?我的宽度设置为100%,所以我有什么遗失的东西吗? 这是代码。 HTML:

<div id="header">
<center>
<table border="0" width="950px">
    <tbody>
    <tr>
    <td>
        <div class="mainRunner"><img class="background" height="200px" src="http://i.imgur.com/1laWPRb.png" width="3000px" /> <img class="mainheader" height="150" src="http://i.imgur.com/sdqMfWT.png" width="500" /></div>
        </td>
        <td>
        <div class="contactinfo"><img class="phone" height="40" src="http://i.imgur.com/5Wew8PC.png" width="250" /> <a href="mailto:kerralt@aol.com"><img class="email" height="30" src="http://i.imgur.com/bXs6aht.png" width="200" /> </a></div></div>
        </td>
    </tr>
</tbody>
</table>

这是CSS:

#header {
width: 100%;
margin-left: auto;
height: 172px;
margin-right: auto;
margin-top: -10px;
background-color: #ffffff;}

.mainheader
{
border: 0px;
position: relative;
z-index: 2;
top: -185px;
left: 265px;
}
.phone
{ 
position: relative;
top: -85px;
left: -2230px}
.email
{ 
position: relative;
top: -75px;
left: -2195px}

网站为http://kerryaltmantest.info

谢谢!

1 个答案:

答案 0 :(得分:0)

使用背景颜色图像作为表格的背景图像,使用repeat而不是img,并将表格宽度设置为100%。

table
{
 background-image: url("http://i.imgur.com/1laWPRb.png");
 background-repeat: repeat;
 width:100%;
}