Hello,
I have been working on a new website and design. I have only done 1/4 of the index page to work on.
So see this picture, I have this image as a header on the site;
http://www.v7n.com/forums/attachment...1&d=1330638679
And on the long white bar on the site i have put links on it like this ;
http://www.v7n.com/forums/attachment...1&d=1330638836
But it does not look good
How do you think i could change the header/html to have menu buttons ? And when you hover your mouse over the button a sub menu appears ?
I would be great full if someone could do this
Here is the html code :
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Home | Drop Host</title>
<style type="text/css">
body{
background-image:url(Images/body-bg.jpg);
background-repeat:repeat-x;
margin: 0px 0px 0px 0px;
font-family:Verdana;
background-color: #F0F4F7;
}
#wrapper {margin: 0 auto; width: 980px;}
#logobanner {width: 982px; height: 111px; background-image:url(Images/logotopbanner.jpg); background-repeat:no-repeat; margin-top:0px;}
#logobannertext {padding-left:337px;padding-top:66px; font-size:14px;}
#mainbanner {width: 982px; height: 329px; background-image:url(Images/mainbanner.jpg); background-repeat:no-repeat; margin-top:-25px;}
#mainbannerkeytext {padding-left:170px;padding-top:190px; color:#FFFFFF; font-size:14px;}
#topsignup{margin-left:675px;margin-top:-65px;}
.signupbtn {display: block;
width:202px;
height:66px;
background: url(Images/top-signupbtn.png); background-repeat:no-repeat;
text-indent: -99999px;}
.signupbtn:hover { background-image: url(Images/top-signup-hover.png); background-repeat:no-repeat;}
#MainContent {width:982px; min-height: 900px; background-color: #d9d7d7;}
#LeftColumn {width:678px; float:left; height:auto;margin-top:20px;padding-left:10px;}
#RightColumn{width:274px; float:right;height:auto;margin-top:20px; padding-left:10px;}
.rightback1{width:196px; height:53px; background-image:url(Images/right-back-banner1.png); background-repeat:no-repeat; padding-left:60px;padding-top:5px;}
.rightback2{width:196px; height:53px; background-image:url(Images/right-back-banner2.png); background-repeat:no-repeat; padding-left:60px;padding-top:5px;}
.rightback3{width:196px; height:53px; background-image:url(Images/right-back-banner3.png); background-repeat:no-repeat; padding-left:60px;padding-top:5px;}
.package{width:310px;height:232px; background-image:url(Images/package-bg.png); background-repeat:no-repeat;display:block;}
.packagepricetxt{margin-left:205px;padding-top:20px;font-size: 24px; color:#FFFFFF;}
.packagemaintxt{margin-left:-200px;margin-top:-60px;width:300px;}
.style3 {font-size: 10px}
.style7 {
font-size: 14px;
color: #000000;
}
.style12 {
color: #3B4576;
font-size: 14px;
font-weight: bold;
}
.style14 {color: #3B4576; font-weight: bold; }
.style16 {color: #134576; font-weight: bold; }
</style>
</head>
<body>
<div id="wrapper">
<div id="logobanner">
<div id="logobannertext"><a href="#">Link 1</a> | <a href="#">Link 2</a>| <a href="#">Link 3</a> | <a href="#">Link 4</a> |<a href="#">Link 5</a> | <a href="#">Link 6</a> | <a href="#">Link 7</a> | <a href="#">Link 8</a> | <a href="#">Link 9</a> |<a href="#"> Link 10</a> | <a href="#">Link 11</a></div>
</div>
<div id="mainbanner">
<div id="mainbannerkeytext">
▪ 3000MB Storage Space<br/>
▪ Unlimited Bandwidth<br />
▪ CPANEL with Softaculous App Installer<br />
▪ Rv Site Builder (create your site with no coding!!)<br />
▪ LiteSpeed Powered Host <br />
</div>
<div id="topsignup">
<a class="signupbtn" href="#">signup</a>
</div>
</div> <!-- End Main Banner -->
<div id="MainContent"> <!-- Start Of Main Content -->
<div id="LeftColumn">
<h2>Why Host With Us?</h2>
<table width="620" border="0" cellpadding="10">
<tr>
<th width="32" scope="col"><img src="Images/whyicon1.png" width="32" height="32" /></th>
<td width="231" scope="col" valign="top"><span class="style16">Value For Money!</span><br />
<span class="style3">With our hosting starting from $3.95 a month
we are offering excellent value for money.</span><br /> </td>
<th width="32" scope="col"><img src="Images/whyicon3.png" width="32" height="32" /></th>
<td width="235" valign="top" scope="col"><span class="style16">No Minimum Contract</span><br />
<span class="style3">You can cancel your service any time you like, we don’t have fixed contracts.</span><br /> </td>
</tr>
<tr>
<td><img src="Images/whyicon2.png" width="32" height="32" /></td>
<td valign="top"><span class="style16">New Businesses</span><br />
<span class="style3">We like to help and offer the best professional
service and support to help your growing business.</span></td>
<td><img src="Images/whyicon4.png" width="32" height="32" /></td>
<td valign="top"><span class="style16">Litespeed Powered</span><br />
<span class="style3">9x Faster then Apache Hosting with better DDos protection.</span></td>
</tr>
</table>
<div class="package" style="float:left;">
<div class="packagepricetxt">
<div align="center">$2.95<br /> <span class="style3">/month</span></div>
<div class="packagemaintxt">
<p class="style14">Yes Package 1</p>
<p><span class="style7">
√ <strong>3GB</strong> RAID Protected Storage<br />
√ <strong>50GB</strong> Premium Data Transfer<br />
√ <span class="style14">Litespeed</span> Web Server<br />
√ Latest </span><span class="style12">Cpanel</span><span class="style7"> with <span class="style14">Softaculous</span><br />
√ <span class="style14">Hourly</span> R1Soft CDP Backups<br />
√ <span class="style14">FMPEG</span> Hosting</span></p>
</div>
</div>
</div>
<div class="package" style="float:right;">
<div class="packagepricetxt">
<div align="center">$4.95<br /> <span class="style3">/month</span></div>
<div class="packagemaintxt">
<p class="style14">Yes Package 2</p>
<p><span class="style7">
√ <strong>10GB</strong> RAID Protected Storage<br />
√ <strong>Unlimited</strong> Data Transfer<br />
√ <span class="style14">Litespeed</span> Web Server<br />
√ Latest </span><span class="style12">Cpanel</span><span class="style7"> with <span class="style14">Softaculous</span><br />
√ <span class="style14">Hourly</span> R1Soft CDP Backups<br />
√ <span class="style14">FMPEG</span> Hosting</span></p>
</div>
</div>
</div>
</div>
<div id="RightColumn">
<div class="rightback1">
30 Day Money Back<br />
<span class="style3">If your not satisfied with our<br /></span><span class="style3"> service. No questions asked</span>
</div>
<div class="rightback2">
99.9% Server Uptime<br />
<span class="style3">Giving you peace of mind knowing your site will always be online</span></div>
<div class="rightback3">
24/7 Customer Support<br />
<span class="style3">Support availiable on our phone number or online help system</span></div>
</div>
</div>
</div>
</body>
</html>
Linear Mode
