Hello on this page http://blogcasternow.com/help/contact2.html The input form fields should be aligned like this Form field 1 === Form field 5 Form field 2 === Form field 6 Form field 3 === Form field 7 Form field 4 === Form field 8 But for some reason it comes up like this Form field 1 Form field 2 Form field 3 Form field 4 -============ Form field 5 -============ Form field 6 -============ Form field 7 -============ Form field 8 Im not sure if this is an html or css problem so i will supply both files: HTML FILE: <!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>Sandigopirnts</title> <link href="style21.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" type="text/css" href="messages.css" /> <script type="text/javascript" src="messages.js"></script> <style> #map { font:.8em Verdana,sans-serif; padding:3px 0pt; padding-top:3px; } .mapseperator { color:#d92100; padding:0 5px; } .gray { color:#999999; } .red { color:#bf000a; } </style> </head> <body> <div id="page"> <div id="inner-page"> <div id="contaner"> <div id="pages"> <div id="header"> <div id="logo"> <a href="#"> <img src="images/logo.jpg" alt="logo" /> </a></div> <div id="logo-text"> Sign & graphic division </div> <div id="header-right"> 1.800.725.5893 </div> </div> <div id="menu"> <div id="menu-left"> </div> <div id="menu-center"> <ul> <li class="line"> <a href="index.html" title="Home">home </a></li> <li class="line"> <a href="#" title="company">Company </a></li> <li class="line"> <a href="#" title="Graphic Specs">Graphic specs </a></li> <li> <a href="#" title="Contact">contact </a></li> </ul> <em><a href="#" title="Sitemap"> Sitemap </a></em> <span> <a href="#" title="Blog">Blog </a></span> </div> <div id="menu-right"> </div> </div> <div id="map"> You are here: <span class="gray">Home</span><span class="mapseperator">»</span><span class="gray">Contact Us</span> </div> <div id="top-banner"> <h2 style="margin-top:33px; font-size:15px;"> CONTACT US <br /> VIA EMAIL OR PHONE <em> <img src="images/arrow-blue.gif" alt="" /> </em> </h2> </div> <div id="line"> <div id="contact"> <h2> CONTACT US </h2> <p> San Diego Sign Printers is owned and operated by Exhib corporation. Provided below is the contact information.</p> <div id="contact-left"> <h2><b class="color"> Exhibe Corporation </b></h2> <p>340 Vernon way Suite H<br /> EI Cajon, CA 92020<br /> Phone: 619.401.1323<br /> </p> <h2> MAP AND DRIVING DIRECTIONS + </h2> <p> Toll free 1.800.725.5893<br /> Email: <a href="mailto:info@sandiegosignprinters.com" class="color">info@sandiegosignprinters.com</a> </p> </div> </div></div> <div id="line"> <div id="form-left"> <div id="wrapper"> <p>Fields marked(<font color="red">* </font>) are required</p> <form name="form" id="form" class="form" onsubmit="return validate(this)" method="post" action="FormMail.php"> <label for="company"> COMPANY<font color="red">*</font></label> <br> <input type="text" name="company" id="company"/><br> <label for="name"> NAME<font color="red">*</font></label> <br> <input type="text" value="" name="name" id="name"/><br> <label for="phone"> PHONE<font color="red">*</font></label> <br> <input type="text" value="" name="phone" id="phone"/><br> <label for="email"> EMAIL <font color="red">*</font></label> <br> <input type="text" value="" name="email" id="email"/><br> <div id="form-right"> <label for="website"> Website<font color="red">*</font></label> <br> <input type="text" name="website" id="website"/><br> <label for="budget"> Budget<font color="red">*</font></label> <br> <input type="text" value="" name="budget" id="budget"/><br> <label for="duedates"> Due Dates<font color="red">*</font></label> <br> <input type="text" value="" name="duedates" id="duedates"/><br> <label for="products"> Products <font color="red">*</font></label> <br> <input type="text" value="" name="products" id="products"/><br> </div> <label for="comment">Comment:</label><br> <textarea name="comment" id="comment" /> </textarea> <div id="button"> <input type="submit" class="submit" value=""/> <input type="reset" value="" class="reset"/> </form> </div> </div> </div></div> <!-- end product--> </div> </div> </div> <div id="border"> </div> <div id="bottom-menu"> <div id="bottom-in"> <div id="bottom-in-menu"> <ul> <li><a href="#" class="brod2"> vinyl banners </a></li> <li><a href="#" class="brod2">large format prints </a></li> <li><a href="#" class="brod2"> vinyllettering </a></li> <li><a href="#" class="brod2"> trade show graphics </a></li> <li><a href="#"> dimensional lettering </a></li> </ul> </div> </div></div> <div id="border2"> </div> <div id="product-dettals"> <div id="product-text"> <div id="footer-top"> <div id="footer-left"> <h2> banner stands </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> <h2> Display Graphics </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> </div> <div id="footer-right"> <h2> Graphic Design </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> <h2> Outdoor signs </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> </div> </div> </div> <div id="border2"> </div> <div id="product-dettals"> <div id="product-text"> <div id="footer-bottom"> <p> <b class="space"><a href="#"> HOME</a> </b>| <b class="space"> <a href="#">COMPANY</a> </b> |<b class="space"> <a href="#">BLOG</a></b> |<b class="space"> <a href="#">CONTACT</a> </b> |<b class="space"> <a href="#">SITEMAP</a> </b> </p> <P> <b class="space-red"> <a href="#">BANNER STANDS</a> </b> | <b class="space-red"> <a href="#">GRAPHIC DESIGN </a></b> | <b class="space-red"> <a href="#">DISPLAY GRAPHICS</a> </b> | <b class="space-red"><a href="#">OUTDOOR SIGNS</a> </b> </P> <p>Copyright 2009 © Exhibe corporation. All Rights Reserved </p> </div> </div></div> </div> </div> </body> </html> Code (markup): and the CSS file is located here: http://blogcasternow.com/help/style21.css Thanks, John
firstly try replacing your html code with this. <!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>Sandigopirnts</title> <link href="main.css" rel="stylesheet" type="text/css" /> <link rel="stylesheet" type="text/css" href="messages.css" /> <script type="text/javascript" src="messages.js"></script> <style> #map { font:.8em Verdana,sans-serif; padding:3px 0pt; padding-top:3px; } .mapseperator { color:#d92100; padding:0 5px; } .gray { color:#999999; } .red { color:#bf000a; } </style> </head> <body> <div id="page"> <div id="inner-page"> <div id="contaner"> <div id="pages"> <div id="header"> <div id="logo"> <a href="#"> <img src="images/logo.jpg" alt="logo" /> </a></div> <div id="logo-text"> Sign & graphic division </div> <div id="header-right"> 1.800.725.5893 </div> </div> <div id="menu"> <div id="menu-left"> </div> <div id="menu-center"> <ul> <li class="line"> <a href="index.html" title="Home">home </a></li> <li class="line"> <a href="#" title="company">Company </a></li> <li class="line"> <a href="#" title="Graphic Specs">Graphic specs </a></li> <li> <a href="#" title="Contact">contact </a></li> </ul> <em><a href="#" title="Sitemap"> Sitemap </a></em> <span> <a href="#" title="Blog">Blog </a></span> </div> <div id="menu-right"> </div> </div> <div id="map"> You are here: <span class="gray">Home</span><span class="mapseperator">»</span><span class="gray">Contact Us</span> </div> <div id="top-banner"> <h2 style="margin-top:33px; font-size:15px;"> CONTACT US <br /> VIA EMAIL OR PHONE <em> <img src="images/arrow-blue.gif" alt="" /> </em> </h2> </div> <div id="line"> <div id="contact"> <h2> CONTACT US </h2> <p> San Diego Sign Printers is owned and operated by Exhib corporation. Provided below is the contact information.</p> <div id="contact-left"> <h2><b class="color"> Exhibe Corporation </b></h2> <p>340 Vernon way Suite H<br /> EI Cajon, CA 92020<br /> Phone: 619.401.1323<br /> </p> <h2> MAP AND DRIVING DIRECTIONS + </h2> <p> Toll free 1.800.725.5893<br /> Email: <a href="mailto:info@sandiegosignprinters.com" class="color">info@sandiegosignprinters.com</a> </p> </div> </div></div> <div id="line"> <div id="wrapper"> <p>Fields marked(<font color="red">* </font>) are required</p> <div id="form-left"> <form name="form" id="form" class="form" onsubmit="return validate(this)" method="post" action="FormMail.php"> <label for="company"> COMPANY<font color="red">*</font></label> <br> <input type="text" name="company" id="company"/><br> <label for="name"> NAME<font color="red">*</font></label> <br> <input type="text" value="" name="name" id="name"/><br> <label for="phone"> PHONE<font color="red">*</font></label> <br> <input type="text" value="" name="phone" id="phone"/><br> <label for="email"> EMAIL <font color="red">*</font></label> <br> <input type="text" value="" name="email" id="email"/><br> </div> <div id="form-right"> <label for="website"> Website<font color="red">*</font></label> <br> <input type="text" name="website" id="website"/><br> <label for="budget"> Budget<font color="red">*</font></label> <br> <input type="text" value="" name="budget" id="budget"/><br> <label for="duedates"> Due Dates<font color="red">*</font></label> <br> <input type="text" value="" name="duedates" id="duedates"/><br> <label for="products"> Products <font color="red">*</font></label> <br> <input type="text" value="" name="products" id="products"/><br> </div> <label for="comment">Comment:</label><br> <textarea name="comment" id="comment" /> </textarea> <div id="button"> <input type="submit" class="submit" value=""/> <input type="reset" value="" class="reset"/> </form> </div> </div> </div></div> <!-- end product--> </div> </div> </div> <div id="border"> </div> <div id="bottom-menu"> <div id="bottom-in"> <div id="bottom-in-menu"> <ul> <li><a href="#" class="brod2"> vinyl banners </a></li> <li><a href="#" class="brod2">large format prints </a></li> <li><a href="#" class="brod2"> vinyllettering </a></li> <li><a href="#" class="brod2"> trade show graphics </a></li> <li><a href="#"> dimensional lettering </a></li> </ul> </div> </div></div> <div id="border2"> </div> <div id="product-dettals"> <div id="product-text"> <div id="footer-top"> <div id="footer-left"> <h2> banner stands </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> <h2> Display Graphics </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> </div> <div id="footer-right"> <h2> Graphic Design </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> <h2> Outdoor signs </h2> <p> Morbi sapien. Nunc adipiscing tortor vitae nibh. Proin ut enim quis nulla blandit fermentum. Vestibulum id massa. Etiam lacinia enim sit amet urna. Nulla tristique sem et mauris. Fusce mollis libero vitae dolor. Vestibulum fringilla eleifend arcu. Vestibulum pede purus, suscipit a, ultrices vitae, dignissim a, arcu. Suspendisse placerat. Nulla iaculis. Quisque fringilla, urna at rutrum dictum, nisl ante bibendum eros, quis pulvinar neque est eu orci. Sed sit amet tortor. Mauris ullamcorper tortor quis libero. Nulla imperdiet libero vitae urna. Curabitur ullamcorper eros. Donec sollicitudin lectus eget nisl. Vestibulum ante sapien, viverra a, accumsan sit amet, laoreet at, ipsum. Fusce convallis euismod urna. </p> <h3> <a href="#">VIEW MORE</a></h3> </div> </div> </div> <div id="border2"> </div> <div id="product-dettals"> <div id="product-text"> <div id="footer-bottom"> <p> <b class="space"><a href="#"> HOME</a> </b>| <b class="space"> <a href="#">COMPANY</a> </b> |<b class="space"> <a href="#">BLOG</a></b> |<b class="space"> <a href="#">CONTACT</a> </b> |<b class="space"> <a href="#">SITEMAP</a> </b> </p> <P> <b class="space-red"> <a href="#">BANNER STANDS</a> </b> | <b class="space-red"> <a href="#">GRAPHIC DESIGN </a></b> | <b class="space-red"> <a href="#">DISPLAY GRAPHICS</a> </b> | <b class="space-red"><a href="#">OUTDOOR SIGNS</a> </b> </P> <p>Copyright 2009 © Exhibe corporation. All Rights Reserved </p> </div> </div></div> </div> </div> </body> </html> <!-- www.000webhost.com Analytics Code --> <script type="text/javascript" src="http://analytics.hosting24.com/count.php"></script> <noscript><a href="http://www.hosting24.com/"><img src="http://analytics.hosting24.com/count.php" alt="web hosting" /></a></noscript> <!-- End Of Code --> Code (markup): First of all - All i did was place the <div id="form-left"> inside the wrapper and then gave it a close </div> which you missed out on. I only fixed that part of your code the rest is really up to you. Secondly - I don' mean to be rude but your code is very badly formed and you will probably encounter more problems along the way. I'm sure there are more divs which are not closed properly as well. -Elements like the <br> tag should be self closed to meet standards so replace these with <br/> (same effect but properly formed) -styling should be used in css rather than inline. for e.g. <h2 style="margin-top:33px; font-size:15px;"> could easily be done in the stylesheet with h2{margin-top:33px; font-size:15px;} -when you put css within the head of the html page you need to put in within the tags <style type="text/css"> #your internal css </style> I could go on for a long time with these things. If you want to write well formed code look for tutorials on sites like www.w3schools.com. Also they have a validator which will check your code and tell you the errors it has from the badly formed code. Just google w3c validator If you want more help don't be afraid to message me.
Yah the code is malformed because i tried to intergrate it with that javascript form validator if you wouldnt mind could you help me out with this i will send you the original files without them improperly merged with the javascript validator also whats with the analytics code at the end?
I am only asking because you have left the installation for your phpbb in the root of that file and it can be accessed by anyone.
by the way, it was probably your hosting that put the analytics at the bottom of your code. you should be able to disable this if you wanted.
oh yah i do lol i know about this i just havnt had time to really care or do anything about it i just use the domain for testing stuff so if stuff gets messed up i just delete anything ....
fair enough. Have not got much time 2night as is late in the UK. By all means send me over some code and if i have time i can look at it 2moro for you.