1. This website uses cookies. By continuing to use this website you are giving consent to cookies being used.
    For information on cookies and how you can disable them visit our Cookie Usage page.
    Dismiss Notice

HTML If you are good at HTML....

Discussion in 'Web Development' started by DogOnTravels, Jul 17, 2008.

  1. DogOnTravels

    DogOnTravels New Member

    ..I would really appreciate your help! I'll give everyone who even tries to help me out reps because I need to fix my site really soon. I have recently become an affiliate of a travel company and I have my entire site hooked into their hotel booking engine. Everything on the site is just about finished except I need to customize the buttons at the top of the page. The guy that I deal with from the travel company gave me this HTML to put into my index.html, but I have no idea where it should go...

    This is what he gave me...

    HTML:
    #mainnav{float: left; width: 724px; margin: 0 auto; background: url('http://secure.rezserver.com/data/2092/menu_bg.gif') 0 0 no-repeat;position: relative; left: 33px;}
              #mainnav ul{float: left; margin: 0; padding: 5px 15px; list-style: none; height: 64px; font-size: 11pt;}
                          #mainnav ul li{margin: 3px; padding: 0; float: left;}
                                      #mainnav ul li a{padding: 7px 0 12px 0; display: block; width: 108px;color: #fff; font-weight: bold; text-decoration: none; background: url('http://secure.rezserver.com/data/2092/m6_1.gif') 0 0 no-repeat;}
                                      #mainnav ul li a:hover{background: url('http://secure.rezserver.com/data/2092/m6.gif') 0 0 no-repeat;}
   
  <div id="mainnav">
              <ul>
                          <li><a href="http://2pennytravel.com">Home</a></li>
                          <li><a href="http://www.priceline.com/flights/default.asp?refid=PLHBC2092OPQ&refclickid=2PennyTravel.com">Flights</a></li>
                          <li><a href="Http://www.priceline.com/rentalcars/default.asp?refid=PLHBC2092OPQ&refclickid=2PennyTravel.com">Car Rentals</a></li>
                          <li><a href="/search/?refid=2092">Search</a></li>
                          <li><a href="/help/faq/?refid=2092">FAQ</a></li>
                          <li><a href="/help/contact/?refid=2092">Contact</a></li>
              </ul>
              </div><!--/mainnav-->
    I need to insert the above somewhere into my index.html to customize my buttons, but I am totally unsure of where to put it. Here is some of my index.html (where I think it is suppose to go around)... let me know if you guys can help me out.

    HTML:
    
<title>2 Penny Travel!</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="rollover.js" type="text/javascript"></script>
</head>
<body id="page1" onload="MM_preloadImages('images/m2_1.gif','images/m3_1.gif','images/m4_1.gif','images/m5_1.gif','images/m6_1.gif')">
<table>
    <tr>
        <td id="header">
          <table class="main_table">
              <tr>
                <td class="site_center">
                    <table class="site_center1">
                        <tr>
                            <td class="row1">
                            <a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','images/m1_1.gif',1)"><img src="images/m1_1.gif" alt=" " width="108" height="36" id="Image1" /></a><a href="http://www.priceline.com/flights/default.asp?refid=PLHBC2092OPQ&refclickid=2PennyTravel.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images/m2_1.gif',1)"><img src="images/m2.gif" alt=" " width="108" height="36"  id="Image2" /></a><a href="http://www.priceline.com/rentalcars/default.asp?refid=PLHBC2092OPQ&refclickid=2PennyTravel.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images/m3_1.gif',1)"><img src="images/m3.gif" alt=" " width="108" height="36" id="Image3" /></a><a href="http://secure.rezserver.com/search/?refid=2092" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','images/m4_1.gif',1)"><img src="images/m4.gif" alt=" " width="108" height="36" id="Image4" /></a><a href="http://secure.rezserver.com/help/faq/?refid=2092" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/m5_1.gif',1)"><img src="images/m5.gif" alt=" " width="108" height="36" id="Image5" /></a><a href="http://secure.rezserver.com/help/contact/?refid=2092" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/m6_1.gif',1)"><img src="images/m6.gif" alt=" " width="108" height="36" id="Image6" /></a> </td>
                        </tr>
                        <tr>
                            <td class="row2">
                                <table>
                                    <tr>
                                        <td class="col1"></td>
                                        <td class="col2">
                                            <table>
                                                <tr>
                                                    <td class="r1">
                                                      <a href="index.html"><img src="images/spacer.gif" alt="" width="273" height="82" class="pos" /></a>
                                                      <h1>2 Penny Travel! </h1>                                                  
                                                     </td>
                                                </tr>
                                                <tr>
                                                    <td class="r2">
                                                                                                        </td>
                                                </tr>
                                            </table>
                                        </td>
                                        <td class="col3"></td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </td>
              </tr>
          </table>
        </td>
    </tr>
    <tr>
        <td id="content">
            <table>
                <tr>
                    <td class="col1"></td>
                    <td class="col2">
                        <table class="bg">
                            <tr>
                                <td class="row1"></td>
                            </tr>
                            <tr>
                                <td class="row2">
                                    <table>
                                        <tr>
                                            <td class="c1">&nbsp;</td>
                                            <td class="c2">
                                                <table class="bg1">
                                                    <tr>
                                                        <td>
    If anyone can help me out, I'll definitely return the favor...thanks so much for your time.

    Matt
     
    DogOnTravels, Jul 17, 2008
    #1
  2. pezboy45

    pezboy45 Mod/Design & Coder [Pro]

    Ok, well first of all.
    Code:
    #mainnav{float: left; width: 724px; margin: 0 auto; background: url('http://secure.rezserver.com/data/2092/menu_bg.gif') 0 0 no-repeat;position: relative; left: 33px;}
              #mainnav ul{float: left; margin: 0; padding: 5px 15px; list-style: none; height: 64px; font-size: 11pt;}
                          #mainnav ul li{margin: 3px; padding: 0; float: left;}
                                      #mainnav ul li a{padding: 7px 0 12px 0; display: block; width: 108px;color: #fff; font-weight: bold; text-decoration: none; background: url('http://secure.rezserver.com/data/2092/m6_1.gif') 0 0 no-repeat;}
                                      #mainnav ul li a:hover{background: url('http://secure.rezserver.com/data/2092/m6.gif') 0 0 no-repeat;}
    That code is CSS, so you can either put it in your CSS file, or if you only want it on your home page (index.html)
    Then you can do this:
    HTML:
    <style>#mainnav{float: left; width: 724px; margin: 0 auto; background: url('http://secure.rezserver.com/data/2092/menu_bg.gif') 0 0 no-repeat;position: relative; left: 33px;}
               #mainnav ul{float: left; margin: 0; padding: 5px 15px; list-style: none; height: 64px; font-size: 11pt;}
                           #mainnav ul li{margin: 3px; padding: 0; float: left;}
#mainnav ul li a{padding: 7px 0 12px 0; display: block; width: 108px;color: #fff; font-weight: bold; text-decoration: none; background: url('http://secure.rezserver.com/data/2092/m6_1.gif') 0 0 no-repeat;}
#mainnav ul li a:hover{background: url('http://secure.rezserver.com/data/2092/m6.gif') 0 0 no-repeat;}</style>
    And place that before your </head> tag.
    And, make sure, that its RIGHT before that </head> tag, or it might give you some problems.

    Hope this helps!
    And let us know how it goes!
     
    pezboy45, Jul 18, 2008
    #2
  3. DogOnTravels

    DogOnTravels New Member

    Andrew thanks for your help, but I tried what you said and it didnt work. I copied and pasted exactly what you said and made sure it was directly about the </head> tag. The page looks exactly the same which is weird, and there is still not text on the buttons. Any other ideas? Thanks for your help bro
     
    DogOnTravels, Jul 18, 2008
    #3
  4. pezboy45

    pezboy45 Mod/Design & Coder [Pro]

    Let me mess around with some stuff, and I'll let you know.
     
    pezboy45, Jul 18, 2008
    #4
  5. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    Your Google Script is in the wrong place. It should be after the </head> tag not before, like below, Is one problem. I'm not sure of the table in menu section.
    Post your css and index file.

    HTML:
    <title>2 Penny Travel!</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="rollover.js" type="text/javascript"></script>
<style>#mainnav{float: left; width: 724px; margin: 0 auto; background: url('http://secure.rezserver.com/data/2092/menu_bg.gif') 0 0 no-repeat;position: relative; left: 33px;}
#mainnav ul{float: left; margin: 0; padding: 5px 15px; list-style: none; height: 64px; font-size: 11pt;}
#mainnav ul li{margin: 3px; padding: 0; float: left;}
#mainnav ul li a{padding: 7px 0 12px 0; display: block; width: 108px;color: #fff; font-weight: bold; text-decoration: none; background: url('http://secure.rezserver.com/data/2092/m6_1.gif') 0 0 no-repeat;}
#mainnav ul li a:hover{background: url('http://secure.rezserver.com/data/2092/m6.gif') 0 0 no-repeat;}</style>
</head>
 
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-4175619-2");
pageTracker._initData();
pageTracker._trackPageview();
</script>
 
<body id="page1" onload="MM_preloadImages('images/m2_1.gif','images/m3_1.gif','images/m4_1.gif','images/m5_1.gif','images/m6_1.gif')">
     
    ishkey, Jul 19, 2008
    #5
  6. DogOnTravels

    DogOnTravels New Member

    This is my index.html... I do not have a CSS file, I hope this helps. I have to split it in 2 posts because of its length
    HTML:
    <?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<META HTTP-EQUIV="Content-Type" content="text/html; charset=utf-8">
<meta name="verify-v1" content="+9U5fXMdfNM69yD/plp6X41M9dOZ4aVyHvgnE+ZtDkM=" />
<META NAME="Copyright" content="2 Penny Travel">
<META HTTP-EQUIV="content-language" content="EN">
<META NAME="Rating" content="General">
<META NAME="Keywords" content="travel, cheap travel, cheapest travel, wholesale travel, discount travel, best travel, price travel, orbit travel, hotel travel, easy travel, no hassle travel, simple travel, save travel, trip, cheap trip, cheapest trip, wholesale trip, discount trip, discounted trip, easy trip, simple trip, penny travel, penny trip, 2 penny travel, 2 penny trip, 2 penny, penny vacation, cheap vacation, cheapest vacation, discount vacation, wholesale vacation, simple vacation, free vacation, free trip, free travel, cheapest vacation, happy vacation, happy trip, happy travel, easy trip, easy vacation, vacation, true trip, true vacation, true travel,  right trip for the right price, value trip, value travel, value vacation, getaway, hawaii getaway, convenient travel, convenient trip, convenient vacation, convenient getaway, easy getaway, fun getaway, fun trip, fun travel, fun vacation, easy getaway, discount getaway, wholesale getaway, convenient getaway,  getaway for the poor, penny getaway, affordable trip, affordable vacation, affordable travel, affordable getaway, affordable hotel, discount hotel, discount flight, discount car rental, wholesale hotel, affordable hotel, affordable getaway, 2 penny travel, penny travel, 2 penny getaway, 2 penny trip, cheap holiday, discount holiday, tickets, plane tickets, wholesale holiday, wholesale vacation, wholesale getaway, cheapest hotels, hotels.com, orbitz.com, travelacity.com, travel a city, travel hawaii, book hotel, book trip, book vacation, travelocity.com, book cheap hotel, book 4 star hotel, book 3 start hotel, book 5 start hotel, book four star hotel, book three start hotel, book five star hotel, book it">
<META NAME="Abstract" content="Welcome to 2 Penny Travel!  The Right Trip for the Right Price!">
<META NAME="Title" content="2 Penny Travel!">
<META NAME="revisit-after" content="7">
<META NAME="Robots" content="index,nofollow">
<META NAME="Description" content="Welcome to 2 Penny Travel! The Right Trip for the Right Price!<br>

<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
var pageTracker = _gat._getTracker("UA-4175619-2");
pageTracker._initData();
pageTracker._trackPageview();
</script>

We are pleased to announce that we have recently teamed up with one of the largest online booking engines to provide you with the cheapest hotel reservations around the globe! We are working our hardest to keep 2 Penny Travel hotel booking fees lower than any of our competition.   Lower fees means less money leaving your pocket and a much better trip for you!">
<META HTTP-EQUIV="Cache-Control" content="no-cache">
<META HTTP-EQUIV="Expires" content="0">
     
    DogOnTravels, Jul 21, 2008
    #6
  7. DogOnTravels

    DogOnTravels New Member

    HTML:
    <title>2 Penny Travel!</title>
<link href="style.css" rel="stylesheet" type="text/css" />
<script src="rollover.js" type="text/javascript"></script>
<style>#mainnav{float: left; width: 724px; margin: 0 auto; background: url('http://secure.rezserver.com/data/2092/menu_bg.gif') 0 0 no-repeat;position: relative; left: 33px;}
               #mainnav ul{float: left; margin: 0; padding: 5px 15px; list-style: none; height: 64px; font-size: 11pt;}
                           #mainnav ul li{margin: 3px; padding: 0; float: left;}
#mainnav ul li a{padding: 7px 0 12px 0; display: block; width: 108px;color: #fff; font-weight: bold; text-decoration: none; background: url('http://secure.rezserver.com/data/2092/m6_1.gif') 0 0 no-repeat;}
#mainnav ul li a:hover{background: url('http://secure.rezserver.com/data/2092/m6.gif') 0 0 no-repeat;}</style></head>
<body id="page1" onload="MM_preloadImages('images/m2_1.gif','images/m3_1.gif','images/m4_1.gif','images/m5_1.gif','images/m6_1.gif')">
<table>
    <tr>
        <td id="header">
          <table class="main_table">
              <tr>
                <td class="site_center">
                    <table class="site_center1">
                        <tr>
                            <td class="row1">
                            <a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','images/m1_1.gif',1)"><img src="images/m1_1.gif" alt=" " width="108" height="36" id="Image1" /></a><a href="http://www.priceline.com/flights/default.asp?refid=PLHBC2092OPQ&refclickid=2PennyTravel.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images/m2_1.gif',1)"><img src="images/m2.gif" alt=" " width="108" height="36"  id="Image2" /></a><a href="http://www.priceline.com/rentalcars/default.asp?refid=PLHBC2092OPQ&refclickid=2PennyTravel.com" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images/m3_1.gif',1)"><img src="images/m3.gif" alt=" " width="108" height="36" id="Image3" /></a><a href="http://secure.rezserver.com/search/?refid=2092" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','images/m4_1.gif',1)"><img src="images/m4.gif" alt=" " width="108" height="36" id="Image4" /></a><a href="http://secure.rezserver.com/help/faq/?refid=2092" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/m5_1.gif',1)"><img src="images/m5.gif" alt=" " width="108" height="36" id="Image5" /></a><a href="http://secure.rezserver.com/help/contact/?refid=2092" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/m6_1.gif',1)"><img src="images/m6.gif" alt=" " width="108" height="36" id="Image6" /></a> </td>
                        </tr>
                        <tr>
                            <td class="row2">
                                <table>
                                    <tr>
                                        <td class="col1"></td>
                                        <td class="col2">
                                            <table>
                                                <tr>
                                                    <td class="r1">
                                                      <a href="index.html"><img src="images/spacer.gif" alt="" width="273" height="82" class="pos" /></a>
                                                      <h1>2 Penny Travel! </h1>                                                  
                                                     </td>
                                                </tr>
                                                <tr>
                                                    <td class="r2">
                                                                                                        </td>
                                                </tr>
                                            </table>
                                        </td>
                                        <td class="col3"></td>
                                    </tr>
                                </table>
                            </td>
                        </tr>
                    </table>
                </td>
              </tr>
          </table>
        </td>
    </tr>
    <tr>
        <td id="content">
            <table>
                <tr>
                    <td class="col1"></td>
                    <td class="col2">
                        <table class="bg">
                            <tr>
                                <td class="row1"></td>
                            </tr>
                            <tr>
                                <td class="row2">
                                    <table>
                                        <tr>
                                            <td class="c1">&nbsp;</td>
                                            <td class="c2">
                                                <table class="bg1">
                                                    <tr>
                                                        <td>
                                                            <div class="indent">
                                                                <img src="images/t1_1.gif" alt="" class="title_top" />
                                                            <FONT SIZE="+1"><b>Welcome to 2 Penny Travel!<FONT SIZE="-1"></b><br><br/>  We are pleased to announce that we have recently teamed up with one of the largest online booking engines to provide you with the cheapest hotel reservations around the globe!   We are working our hardest to keep <b>2 Penny Travel</b> hotel booking fees lower than Expedia, Travelocity, Orbitz, and even Hotels.com. Lower fees means lower prices on the hotels you want. <br/><br><b>2 Penny Travel</b> focuses on hotel booking, but we now offer cheap airfare and car rentals through Priceline.com as well.  Enter <b>2 Penny Travel</b> below to find <b>The Right trip for The Right Price!</b>
                                                            <div class="right1">
                                                                <a href="http://secure.rezserver.com/home/?refid=2092"><img src="images/view_more_news.gif" alt="" /></a>                                                            </div>
                                                            <br style="clear:both" />
                                                            <img src="images/t1_2.gif" alt="" class="title_bot" />
                                                            <table class="box">
                                                                <tr>
                                                                    <td class="column1"><img src="images/p1_2.gif" alt="" /></td>
                                                                    <td class="column2">
                                                                        <a href="http://secure.rezserver.com/home/?refid=2092"><img src="images/p1_3.gif" alt="" /></a><a href="http://secure.rezserver.com/home/?refid=2092"><img src="images/p1_4.gif" class="img1" alt="" /></a><a href="http://secure.rezserver.com/home/?refid=2092"><img src="images/p1_5.gif" alt="" /></a>
     
    DogOnTravels, Jul 22, 2008
    #7
  8. DogOnTravels

    DogOnTravels New Member

    HTML:
    [html]
                                                                         <div class="indent1">
                                                                             <FONT SIZE="-1">Not sure if you are going to make your trip?  No worries.  2 Penny Travel now offers our customers a <FONT SIZE="+1">No Cancellation Fee <FONT SIZE="-1">policy on every published price hotel!  Book your hotel now!<FONT SIZE="+1">                                                                        </div>
                                                                         <div class="right2"><a href="http://secure.rezserver.com/home/?refid=2092"><img src="images/view_all_photos.gif" alt="" /></a></div>                                                                    </td>
                                                                 </tr>
                                                             </table>
                                                             </div>
                                                         </td>
                                                     </tr>
                                                 </table>
                                             </td>
                                             <td class="c3">
                                                 <div class="indent">
                                                     <img src="images/t1_3.gif" alt="" class="title" />
                                                         <div class="box">
                                                             <ul class="list12">
                                                                 <li><a href="http://secure.rezserver.com/city/?refid=2092&rs_cid=3000019204&t=lp">Philadelphia: Rooms as low as $83 per night!</a></li>
                                                                 <li><a href="http://secure.rezserver.com/city/?refid=2092&rs_cid=3000016152&t=lp">New York City: Rooms as low as $129 per night!</a></li>
                                                                 <li><a href="http://secure.rezserver.com/city/?refid=2092&rs_cid=3000015284&t=lp">Las Vegas: Rooms as low as $49 per night!</a></li>
                                                                 <li class="bgd_1"><a href="http://secure.rezserver.com/city/?refid=2092&rs_cid=3000014521">Atlantic City: Rooms as low as $105 per night!</a></li>
                                                                 <li class="bgd_2"><a href="http://secure.rezserver.com/city/?refid=2092&rs_cid=3000003349&t=lp">Orlando: Rooms as low as $49 per night!</a></li>
                                                                 <li><a href="http://secure.rezserver.com/city/?refid=2092&rs_cid=3000001349&t=lp">Phoenix: Rooms as low as $39 per night!</a></li>
                                                                 <li class="bgd_1"><a href="http://secure.rezserver.com/city/?refid=2092&rs_cid=3000001947&t=lp">Los Angeles: Rooms as low as $59 per night!</a></li>
                                                                <li class="none bgd_2"><a href="http://www.priceline.com/qp.asp?productid=5&OMC=O&city=Philadelphia,PA&rooms=1&checkindate=07/13/2008&checkoutdate=07/15/2008&refid=PLHBC2092OPQ">or...<br><FONT SIZE="+2">NAME YOUR OWN PRICE!</a></li>
                                                             </ul>
                                                         </div>
                                               </div>
                                             </td>
                                         </tr>
                                     </table>
                                 </td>
                             </tr>
                             <tr>
                                 <td class="row3"></td>
                             </tr>
                         </table>
                     </td>
                     <td class="col3"></td>
                 </tr>
             </table>
         </td>
     </tr>
     <tr>
         <td id="footer">
             <table class="main_table">
                 <tr>
                     <td class="site_center">
                         <table class="site_center1">
                             <tr>
                                 <td class="indent">
                                     2 Penny Travel (c) 2008 <a href="http://secure.rezserver.com/help/privacy/?refid=2092">Privacy Policy</a>                                
                                 </td>
                             </tr>
                         </table>
                     </td>
                 </tr>
             </table>
         </td>
     </tr>
 </table>
 </body>
 </html>
    [/html]
     
    DogOnTravels, Jul 22, 2008
    #8
  9. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    but you do have a css file and here is your code showing it.
    <link href="style.css" rel="stylesheet" type="text/css" />
    the fils is called "style.css"
    ? How much do you know about coding?
    Be honest - it helps us when tring to answer your questions.
    You can always zip up a file and upload it for us to look at.
     
    ishkey, Jul 22, 2008
    #9
  10. DogOnTravels

    DogOnTravels New Member

    I am an amateur with coding but I am learning as I go. Within a few months I taught myself a lot. sorry about the CSS file thing... The only thing uploaded to my site however are the images and index.html...
     
    DogOnTravels, Jul 23, 2008
    #10
  11. pezboy45

    pezboy45 Mod/Design & Coder [Pro]

    Ok, so I found your CSS.
    It wasn't very hard.
    And I got it on the first try.
    http://2pennytravel.com/style.css

    Uhhh.
    Now I forgot what I was gonna say.
    :mad::mad: GAHHHH :mad::mad:
    I'll post later.
     
    pezboy45, Jul 23, 2008
    #11
  12. DogOnTravels

    DogOnTravels New Member

    I'm an idiot. Here is my CSS file...

    HTML:
    table { border:0px; border-collapse:collapse ; width:100%} 
td {vertical-align:top; padding:0px; }
html {height:100%;}



td, table, select, input, textarea{
    font-family:tahoma;
    font-size:100%;
    vertical-align:top;
    color:#5e5e5e
}

form { margin:0px; padding:0px}
body { margin:0px; padding:0px; background:#f18928; height:100%; font-size:100%; line-height:1em}

img {border:0}


td, select, input { font-family:tahoma; color:#3c3b3b; vertical-align:top;  text-align:left; font-size:100%}
.table{ height:100%; }
img{ vertical-align:top}









/*in_line_style*/

p {margin:0; padding:0;}

.list ul { margin:0; padding:0; list-style:none}
.list ul li{ background:url(images/list_bg.gif) no-repeat 0 5px; line-height:18px}
.list ul li a { color:#202020; text-decoration: none; padding-left:16px}
.list ul li a:hover{ text-decoration: underline}

.list1 ul { margin:0; padding:0; list-style:none}
.list1 ul li{ background:url(images/list_bg1.gif) no-repeat 0 5px; line-height:18px}
.list1 ul li a { color:#202020; text-decoration: none; padding-left:16px}
.list1 ul li a:hover{ text-decoration: underline}

.list12 { margin:0; padding:0; list-style:none}
.list12 li{ background: url(images/rep.gif) repeat-x left bottom; padding:13px 8px 8px 13px; height:32px}
.list12 li a { color:#202020; text-decoration:none; background:url(images/bgd_list.gif) no-repeat; padding-left:16px}
.list12 li a:hover{ text-decoration: none}
.list12 .bgd_1 a{  background:url(images/bgd_list1.gif) no-repeat}
.list12 .bgd_2 a{ background:url(images/bgd_list2.gif) no-repeat}
.list12 .none{ background:none}

.right1{ text-align:right}

.title, .title_top, .title_bot{ display:block}

a{ color:#3c3b3b; text-decoration:underline}
a:hover{ text-decoration:none}

strong a{ color:#a60b0b; text-decoration:underline}
strong a:hover{ text-decoration:none}

b{ color:#292727}

h1 { text-indent:-1000px;  padding:0; margin:0; line-height:1em; font-size:1em; background:url(images/logo.gif) no-repeat; width:273px; height:82px}
.pos{ position:absolute; margin:0; padding:0}


.main_table{ width:100%;}
.site_center{text-align:center; width:100%;}
.site_center1{margin:0 auto; text-align:left; width:765px }

.separate{ background:url(images/rep.gif) repeat-x; height:12px}

/*header*/
#header{ font-size:0.6875em}
#header td{ line-height:1.27em}

#header{ height:414px; background:url(images/header.gif) repeat}
#header .main_table{ background: url(images/shape.gif) repeat-x left bottom}
#header .row1{ height:84px; background:url(images/menu_bg.gif) no-repeat center top; padding-left:37px}
#header .row1 img{ margin:11px 7px 0 0 }
#header .row2{ height:330px}
#header .row2 .col1{ width:26px; background:url(images/left.gif) no-repeat left bottom}
#header .row2 .col2{ width:298px}
#header .row2 .col2 td{ color:#595858}
#header .row2 .col2 .r1{ height:101px}
#header .row2 .col2 .r2{ height:229px; background:url(images/bgd.gif) no-repeat}
#header .row2 .col2 .r2 .bg{ background:url(images/title_bg.gif) no-repeat 7px 10px}
#header .row2 .col2 .r2 .r2_1{ height:70px}
#header .row2 .col2 .r2 .r2_1 img{ margin:28px 0 0 76px}
#header .row2 .col2 .r2 .r2_2{ height:30px}
#header .row2 .col2 .r2 .r2_2 input{ width:93px; height:17px}
#header .row2 .col2 .r2 .r2_2 .c1{ width:20px}
#header .row2 .col2 .r2 .r2_2 .c2{ width:36px}
#header .row2 .col2 .r2 .r2_2 .c3{ width:107px}
#header .row2 .col2 .r2 .r2_2 .c4{ width:23px}
#header .row2 .col2 .r2 .r2_2 .c5{ width:112px}

#header .row2 .col2 .r2 .r2_3{ height:16px}
#header .row2 .col2 .r2 .r2_3 .c1{ width:19px}
#header .row2 .col2 .r2 .r2_3 .c2{ width:147px}
#header .row2 .col2 .r2 .r2_3 .c3{ width:132px}

#header .row2 .col2 .r2 .r2_4{ height:26px}
#header .row2 .col2 .r2 .r2_4 .jump{ width:42px; height:19px}
#header .row2 .col2 .r2 .r2_4 .c1{ width:16px}
#header .row2 .col2 .r2 .r2_4 .c2{ width:19px; text-align:center}
#header .row2 .col2 .r2 .r2_4 .c3{ width:49px}
#header .row2 .col2 .r2 .r2_4 .c4{ width:49px}
#header .row2 .col2 .r2 .r2_4 .c5{ width:33px}
#header .row2 .col2 .r2 .r2_4 .c6{ width:49px}
#header .row2 .col2 .r2 .r2_4 .c7{ width:49px}
#header .row2 .col2 .r2 .r2_4 .c8{ width:34px}

#header .row2 .col2 .r2 .r2_5{ height:18px}
#header .row2 .col2 .r2 .r2_5 .c1{ width:13px}
#header .row2 .col2 .r2 .r2_5 .c2{ width:27px; text-align:center; vertical-align:middle}
#header .row2 .col2 .r2 .r2_5 .c3{ width:260px; vertical-align:middle}

#header .row2 .col2 .r2 .r2_6{ height:16px}
#header .row2 .col2 .r2 .r2_6 td{ font-size:10px}
#header .row2 .col2 .r2 .r2_6 .c1{ width:21px}
#header .row2 .col2 .r2 .r2_6 .c2{ width:43px}
#header .row2 .col2 .r2 .r2_6 .c3{ width:56px}
#header .row2 .col2 .r2 .r2_6 .c4{ width:45px}
#header .row2 .col2 .r2 .r2_6 .c5{ width:133px}

#header .row2 .col2 .r2 .r2_7{ height:51px}
#header .row2 .col2 .r2 .r2_7 input{ width:35px; height:15px }
#header .row2 .col2 .r2 .r2_7 .c1{ width:21px}
#header .row2 .col2 .r2 .r2_7 .c2{ width:45px}
#header .row2 .col2 .r2 .r2_7 .c3{ width:54px}
#header .row2 .col2 .r2 .r2_7 .c4{ width:49px}
#header .row2 .col2 .r2 .r2_7 .c5{ width:51px}
#header .row2 .col2 .r2 .r2_7 .c6{ width:78px}

#header .row2 .col3{ width:442px; background:url(images/flash_bg.jpg) no-repeat}
 
/*content*/
#content{ font-size:0.6875em}
#content td{ line-height:1.27em}

#content{ height:526px}
#content .col1{ width:50%; background:url(images/left_content.gif) repeat-x}
#content .col2{ width:765px; background:url(images/cont_l.jpg) no-repeat}
#content .col2 .bg{ width:765px; background:url(images/cont_r.jpg) no-repeat right top}
#content .col2 .row1{ height:18px}
#content .col2 .row2{ height:491px}
#content .col2 .row3{ height:17px}

#content .col3{ width:50%; background:url(images/right_content.gif) repeat-x}

/*footer*/
#footer{ font-size:0.6875em}
#footer td{ line-height:1.27em}


#footer{ height:74px}
#footer .indent{ padding:30px 0 0 26px; color:#ffffff; font-weight:bold}
#footer .indent a{ color:#FFFFFF; text-decoration:underline}
#footer .indent a:hover{ text-decoration:none} 

/*index.html*/
#page1 #content .col2 .row2 .c1{ width:22px}
#page1 #content .col2 .row2 .c2{ width:497px; background:url(images/top_p1.gif) no-repeat}
#page1 #content .col2 .row2 .c2 .bg1{ background:url(images/bot_p1.gif) no-repeat left bottom; height:491px}
#page1 #content .col2 .row2 .c2 .indent{ padding:26px 30px 25px 31px}
#page1 #content .col2 .row2 .c2 .title_top{ margin-bottom:16px}
#page1 #content .col2 .row2 .c2 p{ margin-bottom:18px}
#page1 #content .col2 .row2 .c2 .img{ float:left; margin:3px 21px 29px 0}
#page1 #content .col2 .row2 .c2 .right1{ text-align:right; margin-top:16px; margin-right:5px}
#page1 #content .col2 .row2 .c2 .title_bot{ margin-bottom:7px}
#page1 #content .col2 .row2 .c2 .box{ width:431px; height:142px}
#page1 #content .col2 .row2 .c2 .box .column1{ width:164px}
#page1 #content .col2 .row2 .c2 .box .column2{ width:267px}
#page1 #content .col2 .row2 .c2 .box .column2 .img1{ margin:0 10px 0 11px}
#page1 #content .col2 .row2 .c2 .box .column2 .indent1{ padding:17px 0 15px 9px }
#page1 #content .col2 .row2 .c2 .box .column2 .right2{ text-align:right}

#page1 #content .col2 .row2 .c3{ width:246px}
#page1 #content .col2 .row2 .c3 .indent{ padding:10px 0 0 16px}
#page1 #content .col2 .row2 .c3 .indent .box { width:200px; margin-top:2px}
     
    DogOnTravels, Jul 23, 2008
    #12
  13. DogOnTravels

    DogOnTravels New Member

    HTML:
    
/*index-1.html*/
#page2 #content .col2 .row2 .c1{ width:21px}
#page2 #content .col2 .row2 .c2{ width:724px; background:url(images/bot_p2.gif) no-repeat left bottom}
#page2 #content .col2 .row2 .c2 .bg1{ background:url(images/top_p2.gif) no-repeat; height:491px}
#page2 #content .col2 .row2 .c2 .title_top{ margin:27px 0 18px 32px}
#page2 #content .col2 .row2 .c2 .box{ width:660px; height:143px; margin-left:25px}
#page2 #content .col2 .row2 .c2 .box td{ width:165px; text-align:center;}
#page2 #content .col2 .row2 .c2 .box img{ margin-bottom:8px}
#page2 #content .col2 .row2 .c2 .box a{ color:#9dc434; font-family:arial; font-weight:bold; font-size:11px; text-decoration:none}
#page2 #content .col2 .row2 .c2 .box a:hover{ text-decoration:underline}
#page2 #content .col2 .row2 .c2 .indent{ margin:29px 45px 30px 32px }
#page2 #content .col2 .row2 .c2 .title_bot{ margin-bottom:20px}
#page2 #content .col2 .row2 .c2 .box1{ width:642px; height:115px; margin-top:22px }
#page2 #content .col2 .row2 .c2 .box1 .column1{ width:173px}
#page2 #content .col2 .row2 .c2 .box1 .column2{ width:469px}
#page2 #content .col2 .row2 .c2 .list_block{ width:423px; height:57px; margin-top:15px}
#page2 #content .col2 .row2 .c2 .list_block .l{ width:220px}
#page2 #content .col2 .row2 .c2 .list_block .r{ width:203px}

#page2 #content .col2 .row2 .c3{ width:21px}

/*index-2.html*/
#page3 #content .col2 .row2 .c1{ width:22px}
#page3 #content .col2 .row2 .c2{ width:497px; background:url(images/top_p1.gif) no-repeat}
#page3 #content .col2 .row2 .c2 .bg1{ background:url(images/bot_p1.gif) no-repeat left bottom; height:491px}
#page3 #content .col2 .row2 .c2 .indent{ padding:26px 33px 25px 31px}
#page3 #content .col2 .row2 .c2 .title_top{ margin-bottom:16px}
#page3 #content .col2 .row2 .c2 p{ margin-bottom:13px}
#page3 #content .col2 .row2 .c2 .img{ margin:4px 21px 31px 0; float:left}
#page3 #content .col2 .row2 .c2 strong{ margin-bottom:4px; display:block}
#page3 #content .col2 .row2 .c2 .right1{ margin-top:15px; margin-right:2px}
#page3 #content .col2 .row2 .c2 .title_bot{ margin-bottom:18px}
#page3 #content .col2 .row2 .c2 .box{ width:431px; height:150px}
#page3 #content .col2 .row2 .c2 .box .column1{ width:229px}
#page3 #content .col2 .row2 .c2 .box .column1 table{ height:120px}
#page3 #content .col2 .row2 .c2 .box .column1 td{ height:30px}
#page3 #content .col2 .row2 .c2 .box .column2 td{ height:30px}
#page3 #content .col2 .row2 .c2 .box .column2{ width:202px}
#page3 #content .col2 .row2 .c2 .box .column2 .col1_1{ width:35px}
#page3 #content .col2 .row2 .c2 .box .column2 .col1_2{ width:66px}
#page3 #content .col2 .row2 .c2 .box .column2 .col1_3{ width:49px}
#page3 #content .col2 .row2 .c2 .box .column2 .col1_4{ width:52px}
#page3 #content .col2 .row2 .c2 .box .inp{ width:200px; height:18px; color:#3c3b3b; line-height:12px}
#page3 #content .col2 .row2 .c2 .box .inp1{ width:49px; height:18px; color:#3c3b3b; line-height:12px}
#page3 #content .col2 .row2 .c2 .box .right2{ text-align:right; margin-top:8px}
#page3 #content .col2 .row2 .c2 .box .right2 img{ margin-left:31px}


#page3 #content .col2 .row2 .c3{ width:246px}
#page3 #content .col2 .row2 .c3 .indent{ padding:12px 31px 0 16px}
#page3 #content .col2 .row2 .c3 .title{ margin-bottom:18px}
#page3 #content .col2 .row2 .c3 .ind{ margin-left:17px}
#page3 #content .col2 .row2 .c3 .separate{ margin-top:19px}
#page3 #content .col2 .row2 .c3 ul{ margin-left:13px; margin-top:1px}


/*index-3.html*/
#page4 #content .col2 .row2 .c1{ width:21px}
#page4 #content .col2 .row2 .c2{ width:724px; background:url(images/bot_p2.gif) no-repeat left bottom}
#page4 #content .col2 .row2 .c2 .bg1{ background:url(images/top_p2.gif) no-repeat; height:491px}
#page4 #content .col2 .row2 .c2 .indent{ padding:26px 43px 10px 32px}
#page4 #content .col2 .row2 .c2 .title{ margin-bottom:19px}
#page4 #content .col2 .row2 .c2 p{ margin-bottom:22px}
#page4 #content .col2 .row2 .c2 strong{ display:block; margin-bottom:11px}
#page4 #content .col2 .row2 .c2 .box{ width:649px; height:60px; margin-bottom:11px}
#page4 #content .col2 .row2 .c2 .column1{ width:238px} 
#page4 #content .col2 .row2 .c2 .column2{ width:238px} 
#page4 #content .col2 .row2 .c2 .column3{ width:173px} 
#page4 #content .col2 .row2 .c2 .box1{ width:649px; height:40px; margin-bottom:12px}
#page4 #content .col2 .row2 .c2 .right1{ margin-top:9px}

#page4 #content .col2 .row2 .c3{ width:21px}

/*index-4.html*/
#page5 #content .col2 .row2 .c1{ width:22px}
#page5 #content .col2 .row2 .c2{ width:497px; background:url(images/top_p1.gif) no-repeat}
#page5 #content .col2 .row2 .c2 .bg1{ background:url(images/bot_p1.gif) no-repeat left bottom; height:491px}
#page5 #content .col2 .row2 .c2 .indent{ padding:26px 32px 25px 32px}
#page5 #content .col2 .row2 .c2 .title_top{ margin-bottom:16px}
#page5 #content .col2 .row2 .c2 .box{ margin-top:17px; width:430px; height:118px}
#page5 #content .col2 .row2 .c2 .box .column1{ width:173px; padding-top:4px}
#page5 #content .col2 .row2 .c2 .box .column2{ width:257px}
#page5 #content .col2 .row2 .c2 .box .column2 p{ margin:4px 0 13px 0}
#page5 #content .col2 .row2 .c2 .title_bot{ margin:30px 0 12px 0}

#page5 #content .col2 .row2 .c2 .box1{ margin-top:17px; margin-bottom:12px; width:430px; height:62px}
#page5 #content .col2 .row2 .c2 .box1 .column1{ width:238px}
#page5 #content .col2 .row2 .c2 .box1 .column2{ width:193px}

#page5 #content .col2 .row2 .c3{ width:246px}
#page5 #content .col2 .row2 .c3 .indent{ padding:12px 35px 0 16px; color:#202020}
#page5 #content .col2 .row2 .c3 .indent p{ padding:18px 0 15px 17px}
#page5 #content .col2 .row2 .c3 .indent strong a{ color:#202020; text-decoration:underline; display:block; margin-bottom:4px}
#page5 #content .col2 .row2 .c3 .indent ul{ margin-left:13px; margin-bottom:22px}


/*index-5.html*/
#page6 #content .col2 .row2 .c1{ width:22px}
#page6 #content .col2 .row2 .c2{ width:497px; background:url(images/top_p1.gif) no-repeat}
#page6 #content .col2 .row2 .c2 .bg1{ background:url(images/bot_p1.gif) no-repeat left bottom; height:491px}
#page6 #content .col2 .row2 .c2 .indent{ padding:25px 30px 25px 32px}
#page6 #content .col2 .row2 .c2 .indent .title_top { margin-bottom:16px}
#page6 #content .col2 .row2 .c2 .indent .img{ margin:4px 21px 33px 0; float:left}
#page6 #content .col2 .row2 .c2 .indent .title{ margin-bottom:12px}
#page6 #content .col2 .row2 .c2 .indent .title_bot{ margin:28px 0 20px 0}
#page6 #content .col2 .row2 .c2 .indent .box{ width:431px; height:106px}
#page6 #content .col2 .row2 .c2 .indent .box .column1{ width:228px}
#page6 #content .col2 .row2 .c2 .indent .box .column1 table{ height:90px}
#page6 #content .col2 .row2 .c2 .indent .box .column1 td{ height:30px}
#page6 #content .col2 .row2 .c2 .indent .box .column2{ width:203px}
#page6 #content .col2 .row2 .c2 .indent .box input{ width:200px; height:18px; color:#3c3b3b; display:inline; font-family:tahoma; font-size:11px}
#page6 #content .col2 .row2 .c2 .indent .box textarea{ width:200px; height:78px; color:#3c3b3b; display:inline; font-family:tahoma; font-size:11px; overflow:auto}
#page6 #content .col2 .row2 .c2 .indent .box .right1{ margin-top:10px}
#page6 #content .col2 .row2 .c2 .indent .box .right1 img{ margin-left:27px}

#page6 #content .col2 .row2 .c3{ width:246px}
#page6 #content .col2 .row2 .c3 .indent{ padding:12px 35px 0 16px; color:#202020}
#page6 #content .col2 .row2 .c3 .indent .title{ margin-bottom:18px}
#page6 #content .col2 .row2 .c3 .indent strong{ display:block; margin-bottom:4px}
#page6 #content .col2 .row2 .c3 .indent div{ margin-left:17px; margin-right:5px}
#page6 #content .col2 .row2 .c3 .indent div p{ margin-bottom:14px}

/*index-6.html*/
#page7 #content .col2 .row2 .c1{ width:21px}
#page7 #content .col2 .row2 .c2{ width:724px; background:url(images/bot_p2.gif) no-repeat left bottom}
#page7 #content .col2 .row2 .c2 .bg1{ background:url(images/top_p2.gif) no-repeat; height:491px}
#page7 #content .col2 .row2 .c2 .indent{ padding:26px 27px 10px 32px}
#page7 #content .col2 .row2 .c2 .indent .title{ margin-bottom:16px}
#page7 #content .col2 .row2 .c2 .indent p{ margin-bottom:14px}

#page7 #content .col2 .row2 .c3{ width:21px}
     
    DogOnTravels, Jul 23, 2008
    #13
  14. ishkey

    ishkey Moderator, Logos, Sports Crests Staff Member Verified Member

    Hey pezboy45 take a look at this for him. Everytime I get the top navagatation it messes up the the nav on the right.
    Dave
     
    ishkey, Jul 24, 2008
    #14
  15. DogOnTravels

    DogOnTravels New Member

    thanks for all your help guys, but dont worry about it. i did something a lot more simple and it is ok for now. i appreciate alll your help.
     
    DogOnTravels, Jul 29, 2008
    #15
  16. pezboy45

    pezboy45 Mod/Design & Coder [Pro]

    Yea, I'm really sorry.
    I've got absolutely no idea whats going on.
    It stumps me.
    :/
     
    pezboy45, Jul 29, 2008
    #16
  17. pezboy45

    pezboy45 Mod/Design & Coder [Pro]

    And for your nav, I think it would be better to make them PNG with transparency.
    So, that you don't have that green box.
     
    pezboy45, Jul 29, 2008
    #17
  18. DogOnTravels

    DogOnTravels New Member

    Yea I would do that but I am pretty clueless with this stuff. I only know basic html at this point and even though I have been teaching myself a lot, I am no where near experienced as you guys. I'm not sure how I would even begin to make it look transparent.
     
    DogOnTravels, Jul 30, 2008
    #18