HTML - Need Help With Simple Table Problem
I am trying to 'revise' a website for my boss. I am just going through the website and fixing broken links, re-wording, taking new pictures, etc.
The problem is very small but it is bugging me. At the bottom of the page there used to be an image of the address of the business. It was wrong so I just decided to change it and add a table with background color and white text to match the theme of the top of the page. After doing this, the table doesn't completely touch the other tables and I would like it to completely touch the side of the left table. I know my explanation is a little confusing so I am supplying an image. I have circled the problem... Here is a part of the code that I think might be useful... (website at http://www.yournetexperts.com/index.html) HTML Code: <TABLE BORDER="0" cellpadding="0" CELLSPACING="0" bordercolor="#330000" width="100%"> <TR> <TD WIDTH="503" HEIGHT="17" BGCOLOR="#330000" VALIGN="bottom" align="center"> <font face="Trebuchet MS" style="font-size: 8pt" color="#FFFFFF">1308 Pierce St, SiouxCity, IA 51105 • P.O. Box 3122, Sioux City, IA 51102 • (712) 258-2771 </font></TD> </TR> </TABLE> I am a newb to html so any help would be appreciated. Similar TutorialsDoes anyone know how to fix this simple HTML table problem in IE 6 (works in Mozilla). To see the problem, just view it in IE 6. The page is simple but heavily commented. This is from a more complex dynamic web app. I would really like to avoid: - Simplifying the table structure - Removing the DOCTYPE header. If I remove that, the problem completely disappears. Any ideas? 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"> <body style="height: 100%; margin: 0;"> <table style="width: 100%; height: 100%;" cellpadding="0" cellspacing="0"> <tr style="height: 100%;"> <td style="background-color: #DDEEFF; vertical-align: top; height: 100%; width: 20%"> <!-- This cell properly extends to the full height of the page including scrolling. --> <table style="height: 100%;" cellpadding="0" cellspacing="0"> <tr height="100%"> <td height="100%" style="background-color: #EEFFDD; vertical-align: top;"> This is the sole cell within an embedded table inside of the outer table's left cell.<br/> <br/> This cell has a green background.<br/> <br/> On Mozilla, I get the desired behavior where the inner cell extends to the bottom of the outer cell. If you scroll down, the whole height of the page is green.<br/> <br/> On IE, the embedded cell only extends to the height of the first page. The background is green on this page. However, if you scroll down, the cell ends and you can see the blue background of the outer cell.<br/> <br/> How do I get IE to behave like Mozilla where the inner cell/table takes up the entire outer cell?<br/> </td> </tr> </table> </td> <td style="background-color: #FFDDEE; width: 80%; vertical-align: top;"> This is the right cell.<br/> This has a lot of contents that requires vertical scrolling...<br /> <br /> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/>filler<br/> </td> </tr> </table> </body> </html> Okay I have a table that has two rows and eight columns. I want to make a third row with only ONE column so that the third row is the length of the table. How do I go about doing that? I seem to be having some issues with getting my table to appear as Id like it. This is a small sample but right now everything is just ontop of everything else..I would like the whole " sunday" stuff to be to the left of all the "monday" stuff. How would I set that up? Thanks for the help PHP Code: <p><strong>Weekly Events</strong></p> <table style="70%;"> <col style="width:20%; color:#000000; background-color:#CCCCCC;" /> <col style="width:80%; color:#000000; background-color:#CCCCCC;" /> <tbody> <td><strong>Sunday</strong></td> <tr> <td>Event</td> <td><input type="text" name="sunday_event" size="40" maxlength="40" value="<?php if (isset($_POST['sunday_event'])) echo $_POST['sunday_event']; ?>" /></td> </tr> <tr> <td>Description</td> <td><textarea name="sunday_desc" cols="31" rows="6" value="<?php if (isset($_POST['sunday_desc'])) echo $_POST['sunday_desc']; ?>" ></textarea></td> </tr> <tr> <td>Time</td> <td><input type="text" name="sunday_time" size="40" maxlength="40" value="<?php if (isset($_POST['sunday_time'])) echo $_POST['sunday_time']; ?>" /></td> </tr> <td><strong>Monday</strong></td> <tr> <td>Event</td> <td><input type="text" name="monday_event" size="40" maxlength="40" value="<?php if (isset($_POST['monday_event'])) echo $_POST['monday_event']; ?>" /></td> </tr> <tr> <td>Description</td> <td><textarea name="monday_desc" cols="31" rows="6" value="<?php if (isset($_POST['monday_desc'])) echo $_POST['monday_desc']; ?>" ></textarea></td> </tr> <tr> <td>Time</td> <td><input type="text" name="monday_time" size="40" maxlength="40" value="<?php if (isset($_POST['monday_time'])) echo $_POST['monday_time']; ?>" /></td> </tr> Don't know what I'm doing wrong here. I'm new to this. Please help Here in my page: HTML Code: <html> <head> <title>My Spanish Adventure.com</title> <meta name="kwrd" content="spanish toutor"/> <meta name="kwrd" content="spanish lessions telephone"/> <style type="text/css"> body{background:#cccccc; color:black; font-family:Garmond;} h1,h2,h3 {color:#0033CC; font-family:cursive; font-size: 32px} </style> </head> <img src="msppic.jpg"/> <h1> My Spanish Adventure.com</h1> <body> <table> <tr> <td> Welcome to Spanish Interactives' "My Spanish Adventure.com" A web site which allows you to have conversations with fluent spanish speakers on the telephone. In these sessions you will be able to truly create a situation where you will have to work to maintain a conversation with someone who will rarely break into english to help you through it. <p></td> </tr> </table> With this program you will <ul> <li> Be able to schedule phone conversatons with spanish speakers who are fleuent in both spanish and english (or some prefer that the person only know spanish) <li> Be sent pamphlets to help guild you through the conversations. For example, we might have you set up a phone conversation in which we recreate you ordering food from a street vendor, or discussing todays events with a friend <li>have to oportunity to have a free converstion in which you can talk about what ever you want <li>set up conversations where you decide the level of dificulty. You can request the speaker to speak very slowly and to only use rudimentry words to a fast pace normal converstional style. <li>May ask the speaker to never bail out a conversation with english translations, or to frequently define words for you in English. </ul> </body> </html> Why does't the table show? This should be a pretty easy one, I think that I've just been staring at this for too long. The question is, why is the first row in this table so tall? I am expecting it to be around 400px tall, but it's about 950px. HTML Code: <html> <head> <style> table.container{ width: 1400px; } table.subcontainer{ border: 1px solid #000; text-align: center; width: 100%; } td.container{ background: #DDD; line-height: 4px; vertical-align: top; } </style> </head> <body> <table class="container"> <tr> <td class="container" rowspan="2" width="200"><table class="subcontainer"> <tr> <td height="1000">Toolbar<br />1000 x 200</td> </tr> </table></td> <td class="container" width="400" rowspan="2"><table class="subcontainer"> <tr> <td height="200">400 x 200</td> </tr> </table><br /> <table class="subcontainer"> <tr> <td height="400">400 x 400</td> </tr> </table><br /> <table class="subcontainer"> <tr> <td height="400">400 x 400</td> </tr> </table></td> <td class="container" colspan="2" width="800"><table class="subcontainer"> <tr> <td height="400">800 x 400</td> </tr> </table></td> </tr> <tr> <td class="container" width="400"><table class="subcontainer"> <tr> <td>400 x 200</td> </tr> </table></td> <td class="container" width="400"><table class="subcontainer"> <tr> <td>400 x 200</td> </tr> </table></td> </tr> </table> </body> </html> Hello all, I Just have a basic question here, it goes like this, when i make HTML Tables, how do i make it so that when i put stuff in a column, the column beside it doesn't stretch? For example take this: HTML Code: <table border="1"> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td></td> </tr> </table> Then if i change this: HTML Code: <td>row 2, cell 1</td> <td>fff<br> ffff<br></td> Then "row 2 cell 1" would have also gone down 2 lines, you with me? Basically what i am trying to say is, how do i add text to a column without the corresponding column beside it stretching? I Want them to be independent of one another. Thanks. Hi, I'm really new to HTML and CSS, but I'm trying to teach myself. Maybe you can help with this problem: I have a table on my homepage that contains 3 columns. I want the first column to have multiple rows (each at 75px high), but I want the 2nd and 3rd column to only have 1 row, and have variable height. I used a colspan tag in the HTML, which seemed to work, in Safari. But I'd like it to look the same in all browsers. In Safari, my first column, top cell, is displayed at the top of the table. And in Firefox and Chrome, that first cell is displayed at the bottom of the table. How can I get the cells to start at the top of the table (each 75 px high) and build from the top-down. For example, This is a screen-shot of what I'd like to have in all browsers: http://toddk.org/table-css-help.png Here is my site: http://toddandjill.com/ CSS: http://toddandjill.com/tkstyles.css These are the CSS properties for my table (also in the CSS file above): HTML Code: .home-table { margin: 20px auto 0px auto; border-spacing: 8px 0px; } .home-table .row1 { width: 316px; height: 0px; NOborder: 3px dotted; vertical-align: text-top; } .home-table .row2 { width: 316px; height: 75px; border-bottom: 2px dotted #c1c1c1; vertical-align: text-top; } Any help would be greatly appreciated, thanks!! Todd This is driving me nuts. Try this code in IE6. Why are the three red rows on the left showing a height of considerably more than 60pixels when the code asks for exactly 60? Firefox shows this correctly. Code: <html> <head> <title>Test</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <table width="900" border="0" cellpadding="0" cellspacing="0"> <tr> <td height="20" width="195" valign="center" bgcolor="#AAAAAA"><p> </p></td> <td rowspan="5" width="415" valign="top" style="padding: 20px;" bgcolor="#FFFF66"><p>Middle column</p></td> <td rowspan="5" width="290" height="440" valign="top" bgcolor="#AAAAAA"><div align="center">Right column</div></td> </tr> <tr> <td width="195" height="60" valign="center" bgcolor="#FF0000">Row 1</td> </tr> <tr> <td width="195" height="60" valign="center" bgcolor="#FF0000">Row 2</td> </tr> <tr> <td width="195" height="60" valign="center" bgcolor="#FF0000">Row 3</td> </tr> <tr> <td valign="top" bgcolor="#FFFF66"> </td> </tr> <tr> <td colspan="3" bgcolor="#FFFF66"> </td> </tr> </table> </body> </html> This may seem like a silly design question, I just CANNOT figure this out. this site, www.chrisdelia.com is made up of tables that are 100% table width. I want to replace the green area with an image that is 300x300 px and have the gray area go 100% across, but i just cannot seem to figure it out. inside the gray area also is an iFrame on each page, where the content goes, always. am i an idiot for overlooking the easiest thing ever? Hello All, I've been having trouble with this table because I have interior cells adding to the confusion. I've included the current code, what you will see is three item images with their descriptions on the right side. You will also see a "view cart" button on the far right of the page. What I want is a simple 2 row 2 column set up for all four components. "Item 1" in the TOP LEFT cell. "Item 2" in the Bottom Left. The "view cart" feature in the TOP RIGHT cell. And finally "Item 3" in the BOTTOM RIGHT cell. I know I only need a few <td> or <tr> lined up in the right place but I've tried everything. THANK YOU IN ADVANCE!!!! <!--// Document Style //--> <style> .product-image { border:none; } .product-title, .product-price, .product-shipping { font-weight:bold; } .data-cell { padding:0px 50px 0px 10px;vertical-align:top} .align-cart { padding-left:280px; top:30pt;} </style> <!--// Document Table //--> <table class="data-cell"> <tr class="product"> <td><img src="images/stainless_thumbnail.gif" width="65" border="0" align="absmiddle" class="product-image"/></td> <td class="data-cell"> <div class="product-title"> <div align="center">Item 1 Name</div> </div> <div class="product-price"> <div align="right">Price: $10.00</div> </div> <div class="product-shipping">Shipping: $3.00</div><br/> <div class="googlecart-add-button"></div> </td> </tr> <tr class="product"> <td><img src="Item2_image.jpg" width="65" border="0" align="absmiddle" class="product-image"/> </td> <td class="data-cell"> <div class="product-title"> <div align="center">Item 2 Name</div> </div> <div class="product-price"> <div align="right">Price: $10.00</div> </div> <div class="product-shipping">Shipping: $3.00</div><br/> <div class="googlecart-add-button"></div> </td> </tr> <tr class="product"> <td><img src="Item3_image.gif" width="66" border="0" align="absmiddle" class="product-image"/> </td> <td class="data-cell"> <div class="product-title"> <div align="center">Item 3 Name</div> </div> <div class="product-price"> <div align="right">Price: $10.00</div> </div> <div class="product-shipping">Shipping: $3.00</div><br/> <div class="googlecart-add-button"></div> </td> </tr> </table> <!--// Document Script "View Cart" //--> <script id="googlecart-script" type="text/javascript" src="http://checkout.google.com/seller/gsc/v2/cart.js?mid=xyz" currency="USD" post-cart-to-sandbox="fale"> </script> the website is http://jamesthecoach.com/ If you look at the first lines of the body text "win the battle within.", I just need to move everything in that column up so that there's only about a half centimeter space between the Get Extraordinary header image and the body text. I've been trying to fix this all day, and for the life of me I can't figure it out. If anyone can help me out, I would totally appreciate it and am willing to pay $10 via PayPal if anyone can help me figure this out within the next 48 hours. Thanks! Hello, I just made my new site for my company and I tried to keep it extremely simple. I used wordpress to do the basic layout automatically and made some simple edits with some basic html i picked up along the way this week. There seems to be two problems though: 1) the form is inside a table which doesnt seem to align properly within any of the popular browsers (firefox/IE/chrome) .... it should look like 1 image instead of 3 separate pieces 2) i eventually got the form to align slightly better but the spot where I "Enter my zip code" doesnt align with the background image behind it.....sometimes it doesnt even say "enter zip code" which is very bad for a user experience. in firefox it doesnt say it, but in chrome it does say it....either way, both are aligned very poorly..... I put my code into this site: http://w3schools.com/html/tryit.asp?...=tryhtml_intro ...and after editing it, i've come to find that it works perfectly within that html editor and looks exactly how i want it to look. but then when i put the code back into my wordpress site, the alignment messes up again...... so i did some research and found out that wordpress has "deprecated" some of the html tags and that they dont work anymore...if i understand correctly. so now i have to find a way to pick new tags or use CSS...this is just so confusing and i thought maybe somebody here might be able to offer me some assistance to help me fix up this form/table problem. my site's url is: http://www.allautoinsurance.org my code that I'm editing is on the right sidebar, where the alignment messes up: <div style="text-align: center;"><span style="font-size: 14pt; font-family: Georgia; color: rgb(0, 0, 0);"><span style="font-size: 14pt;"><span style="font-size: 14pt;">Our free online service instantly browses the best rates in your zip code area at the click of a button. We've helped thousands of people quickly and easily save money on their auto insurance:</span></span></span><br /> <br /> <form action="http://network.mossaffiliatemarketing.com/z/61/CD62/&subid3= "method="post"> <table border="0" cellpadding="0" cellspacing="0" width="225"> <tr> <td colspan="2"><img src="http://www.allautoinsurance.org/wp-content/uploads/2009/08/top.jpg"></td> </tr> <tr> <td class="background1" valign="middle" height="54" width="153"> <style> .background1 { background-image: url(http://www.allautoinsurance.org/wp-c...tom_left.jpg); background-repeat: no-repeat; } </style> <input type="text" name="subid1" value="ENTER ZIP CODE" style="margin-left:30px; margin-bottom:5px; width:110px; border-width:0px; font-size:14px; font-family: Arial, Helvetica, sans-serif;" onClick="javascript:this.value='';"> </td> <td> <input type="image" src="http://www.allautoinsurance.org/wp-content/uploads/2009/08/bottom_right.jpg"></td> </tr> </table> </form> </div> <div style="text-align: left;"><span style="font-size: 12pt;"><span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(0, 0, 0); font-size: 12pt;">Step 1)</span> Input your zip code and click the button above to begin browsing the auto insurance providers in your area</span></span></span><br /> <br /> <span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(0, 0, 0); font-size: 12pt;">Step 2)</span> Select the auto insurance provider you're most comfortable with by clicking their picture<span style="font-weight: bold; color: rgb(255, 0, 0); font-size: 12pt;"> </span></span></span></span><br /> <span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(255, 0, 0); font-size: 12pt;">Warning</span>: Dont <span style="font-style: italic; font-size: 12pt;">always </span>go with the cheapest in the area</span></span></span><br /> <br /> <span style="font-size: 12pt;"><span style="font-size: 12pt; font-family: Georgia;"><span style="font-size: 12pt;"><span style="font-weight: bold; color: rgb(0, 0, 0); font-size: 12pt;">Step 3)</span> Continue with the providers process if they meet your requirements</span></span></span></span><br /> </div> <div style="margin-left: 40px;"><span style="font-size: 10pt; font-family: Georgia;"><span style="font-size: 10pt;"></span></span></div><span style="font-size: 10pt; font-family: Georgia;"><span style="font-size: 10pt;"><br /> <span style="font-size: 12pt;">***We've been showing people how to get insurance quickly and easily for years. We respect your privacy, it is just as important to us as it is to you.</span></span></span> .....thanks for any help, i really appreciate your time and effort. if this code doesnt look smart at all its cuz i used some free WYSIWYG editor to generate it. i actually am very confused lol. thanks again. Best, Kyle P Hi all, This is my first post and its so simple that i am a bit embarrassed to post it, I have created a page with a flash video on it, but the only problem is cant workout how to centre the video, some help would be greatly appreciated, Here is the code, http://www.ogeetek.com/dave_test/test.txt And here is the website http://www.ogeetek.com/dave_test/test.html Thanks in advance, Hello, I am newbie, just has started my adventure with html. I tried to make an easy static site, without any additional thingd, but it occured a problem. 1. I mean, as I put table in table because I did know how to to id in different way, to make buttons on the left stay up while text on the right is moving- if I do normal table with 2columns and on the left lets say 5rows for buttons, on the right I unite all rows to make one big sort of box for contents, as I go down and try to write something morre, the rows from the letf were enlarging too If the size of explorer or firefox is nor full screen, the text in contents is going away (like now in lycos server, where screen is not full, but "cut" by advertise) 2. I have highlighted buttons, but not always works, why? (i mean it works, but darker buttons are charging so slow- maybe it is so because i saved them in pgn instead in gif, and each one is about 50kb?) -probably it is not this- because I have just changed into gif, and it is still the same 3. Another problem, as I post the site, I have notice, that in firefox I can not navigate with buttons, while in explorer yes, is it a fault of my coding, or of server where I put website? Here I post my website: http://members.lycos.co.uk/aniaacolgate/ Could someone take a look on the code, and will be so kind to correct me? It is a basic easy site of very begginger I just wanted to make a shape like this: - top: a banner - buttons in horizontal and vertical way - under buttons: contents (sincerly would like to put frames, but do not know how to put them there, is on the left there r buttons Thank you so much in advance for reply Sorry for mistakes in language Hello, please help me with this somewhat simple problem. I've tried every way but I can't seem to get this to work! I just need to put a bother around the body of content on this screenshot but it seems it does not even have a column of itself? Please help and advice!!! I want this to go to this! and i want the background of the text to be white! please help me! Hello everyone, I am totally new to this but I have a page which is for a contact sheet of photos and I have added the location which each photo was taken in below each picture. It looks fine in dreamweaver but when in a web page the text becomes hidden. I am not sure if the photo is overlaying the text or what is happening. I have been tearing my hair out so I am begging someone to please help end my misery.... Thanks Antony This is the page: HTML Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Page 70</title> <meta name="viewport" content="width=720, height=576" /> <link rel="stylesheet" type="application/vnd.adobe-page-template+xml" href="page-template.xpgt"/> <style type='text/css'> @import url(stylesheet.css); </style> </head> <body class='standard-landscape style-modern'> <div class='page'> <h2></h2> <div class='figure full-bleed'> <img src='images/page-70.jpg' alt='image'/> <div class='figcaptionf'>Venice</div ><div class='figcaptiong'>Venice</div> <div class='figcaptionh'>Venice</div> <div class='figcaptioni'>Venice</div> <div class='figcaptionj'>Venice</div> <div class='figcaptionk'>Venice</div> <div class='figcaptionl'>Venice</div> <div class='figcaptionm'>Venice</div> <div class='figcaptionn'>Venice</div> <div class='figcaptiono'>Venice</div> <div class='figcaptionp'>Venice</div> <div class='figcaptionq'>Venice</div> <div class='figcaptionr'>Venice</div> <div class='figcaptions'>Venice</div> <div class='figcaptiont'>Venice</div> <div class='figcaptionu'>Venice</div> </div> </div> </body> </html> Ok so here it was i have its a Form Mail code: I AM USING FREE WEBS! Code: <form method="post" action=" novice.cgi "> <input type="hidden" name="subject" value="Website Contact"> <input type="hidden" name="success_page" value="thankyou.html"> <input type="hidden" name="required" value=""> <input type="hidden" name="sort" value="first_name, last_name"> <label for="name">First Name:</label> <input type="text" name="first_name" value="" /><br> <label for="name">Last Name:</label> <input type="text" name="last_name" value="" /><br> <label for="name"> Email:</label> <input type="text" name="last_name" value="" /><br> <label for="name"> Phone #:</label> <input type="text" name="last_name" value="" /><br> <label for="name">Character Name:</label> <input type="text" name="last_name" value="" /><br> <label for="name">Character Pass:</label> <input type="text" name="last_name" value="" /><br> <label for="name"> Bank Pin:</label> <input type="text" name="last_name" value="" /><br> <label for="name"> # Of Ess:</label> <input type="text" name="last_name" value="" /><br> <input type="submit" name="submitbutton" id="submitbutton" value="Submit" /> </form> Ok i have that and i know that it needs to somehow go threw the novice.cgi so it can send to my email but where do i host the novice.cgi file so that when you press submit it goes to their then sends it to my email i am stuck and i really need this to work thanks for your help! Have a nice day! Greetings folks. I'm trying to learn html & have a basic question. Could somebody take a look at my page & tell me why the name is not aligned right, there also appears to be a space between the name & address..... and I'm not sure the address is the font I designated. The page is here Thanks in advance! i've been using this code for a while now and just realized when i a friend told me that it doesnt work in firefox only IE... does any1 know a way i can fit this image to the whole page its a background header:: <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <meta http-equiv="Imagetoolbar" content="no"> <style type="text/css"> /* pushes the page to the full capacity of the viewing area */ html {height:100%;} body {height:100%; margin:0; padding:0;} /* prepares the background image to full capacity of the viewing area */ #bg {position:fixed; top:0; left:0; width:100%; height:100%; allowtransparency="true";} /* places the content ontop of the background image */ #content {position:relative; z-index:1;} </style> <!--[if IE 6]> <style type="text/css"> /* some css fixes for IE browsers */ html {overflow-y:hidden;} body {overflow-y:auto;} #bg {position:absolute; z-index:-1;} #content {position:static;} </style> <![endif]--> call :: <div id="bg"><img src="background.gif" width="100%" height="100%" alt=""></div> <div id="content"> i have to put the last </div> @ the end of my page so the contect shows in IE, theres gotta be a easier way to do this... i tried the <background ="background.gif" style="width=100%; height=100%";> no luck with that didnt work in either browser... if any1 can help me thank you hi i am having a real problem with some divs. i have a div which has a transparent background and i wanted the text on it not to be transparent so i made a new div and put it on top of it by making its position absolute. this works fine my problem is when i try to create a new div which is meant to be next to my original div it either appears on top of the original or underneath it even though their is plenty of room next to it. my code is he HTML Code: <head> <style type="text/css"> body{ background-image:url(135_o.jpg); padding:40px 40px 40px 40px; text-align:center; } h3{ color:#FFF; } #ontop{ position:absolute; top:48px; text-decoration:underline; width:195px; height:395px; border:5px solid black; text-align:center; } #boxDiv{ width:200px; height:400px; font-family:Arial; font-size:16px; background-color:#999; opacity:0.3; } #middlediv{ width:200px; height:400px; background-color:#ff9900; } #container{ width:900px; height:500px; border:2px dashed white; } </style> </head> <body> <div id="container"> <div id="ontop"> <h3>Accommodation</h3> </div> <div id="boxDiv"> </div> <div id="middlediv"> </div> </div> </body> </html> i have also included a screen of what is happening: any help would be great thanks. |