HTML - I Want To Avoid Tables. How Should I Do This?
First of all, my site has been devoid of tables up until now. It has also been devoid of position defined div tags. I have been using CSS as well as I know how, I've been designing strictly with ems, and I strive to make everything validate.
My problem is, that I don't know how to reliably produce text within or overlaying images. I made a really simple attempt at it he http://www.eversnug.com/test3.php To make the example really easy to look at and break apart, I have designed it without any external CSS, and it is all laid out in pxs. Unfortunately, I have broken the cardinal rule, and used a TABLE for something that is CLEARLY not tabular. This works GREAT in Safari and Chrome, but Opera and Firefox do not handle it the way I would like, and IE butchers it! What can I do? Is there a better, totally different means to accomplish this overlay effect? Do I need to learn a new workaround for designing with tables? Please help, and thanks in advance. Similar Tutorialswhen using tabela and css-headers etc there is always a padding around it that has the same color as the background. i want my tables or whatever i will use to sit fit together with nothing in between. a lot of pages have this so it is possible obv, but how? I know a little about HTML, but I'm getting stuck on a redirection part of a website I run. I'm trying to set up the photo album link and what I want to happen is the photo bucket page to show up under my links on my page instead of popping up a new window. If anyone needs additional info to help I'll give what I can, thanks! Is there any way to avoid to print buttons or images in printer I am creating my first website I want to include the same code in multiple pages but only list the code in one place Is this possible? Hi folks, I'm an amateur webpage designer. I've recently set up a page and am trying to see if there's a solution to something I've noticed when I view my page. In Internet Explorer and icab, it shows the way I would like, but in Safari and Firefox, I see a problem. My webpage is: http://www.worldwideaccessiblewashrooms.com At the top, I have the webpage title in a table. In Safari and Firefox, there is more space on the bottom of the text inside the table than on the top. I used a straightforward table html: <center> <table bgcolor="#f2e891" border="0" style="border: 3px solid black;"> <tr> <td><h2>Worldwide Wheelchair Accessible Washrooms</h2></td> </tr> </table> </center> Is there a way I can change this so that there is equal space above and below the text inside the table box? Thanks![/url] Hi all, I'm looking for ways, how I can avoid multiple form submissions, when a user repeatedly (intentionally or not) refresh the browser (F5 button) after submitting a form? The input in my form is simply an email address. Nothing else. It is used for forgot password function. I have tried unset or set the $_POST['email'] to empty, but it doesn't help. Is there a clever way to do this? Hi Normally, when you have more than one table in your code, the tables will be placed one under each other. Example: <table> ... </table> <table> ... </table> When you want the tables to be placed next to each other, you need to set the align attribute. Example: <table align="left"> ... </table> <table align="left"> ... </table> BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables". Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag? Thanks for your help praiser Hey everyone, I'm new to these boards. Somewhat a newbie at web design, but I know basics. I'm looking to put 2 tables adjacent to each other inside another table. My problem is I can't get the tables to line up the way I want them to. I'll post a picture of how I want it to look, how it looks now and my code. How I want it to look: How it looks now: I want the tables to line up at the top and re-size according to each other so they're always aligned at the top. Code: coming in next 2 posts I have my table all finished and everything.. it looks nice, except the fact that my words.. some of them are cut off. anyone know how to fix this? I have tried making my table smaller in width than my "div", but that still doesn't work. If you could please help me I would greatly appreciate it, and I would like to thank you in advance. EDIT: Title is supposed to be "Tables or CSS" I know, I know - HTML Tables are the spawn of Satan - however, I have a tabbed content box made from html/css/js - when you click on a tab, the content (underneath) changes accordingly. My questions is, I will be having a static list, with the corresponding answers (to the data in the list) targetting from an Excel Driven database - don't ask me why, just what my boss wants... Here is what I have so far: Quote: <TABLE CELLPADDING="2" CELLSPACING="2"> <TR><TD>Sponsor ID:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Client Number:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Sponsor Name:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Brand Name:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Status:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Support Tier:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Sponsor Phone:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Support Phone Number:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Support Email Address:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Parent Name:</TD><TD>FILLER TEXT</TD></TR> <TR><TD>Misdirect Scripting:</TD><TD>FILLER TEXT</TD></TR> </TABLE> He wants the content separated in a "ruled" look, like Excel - however, I didn't know if it would be cool to just use HTML - or if there is another way to do this - It's not going out on the internet (it's going on our Intranet via SharePoint) so I'm not worried about conjunctions and standards (not using HTML tables), etc. Just need to know if there is another way to separate the info with a solid black line - horizontal/vertical between the cells - that looks better than an HTML table border. Thanks! Any idea on how I can get a table with rounded edges? I have been working on rebuilding a website using my somewhat dated knowledge of html. It works fine for my daily needs but I got to a page where I needed a table in a table. What I did looks great in Firefox, but when I check it in IE7 it turns into a nightmare. I'm stuck. Can anyone shed any light on where I turned left when I should have turned right (or something of that sort)? I tacked the page onto another site for now. It's at: http://www.cincinnatigolfcourseguide...m-ductwork.php Hey htmlforum and members can someone help me out with a carousel for image *small_blank.png*..(just start me off) thanx... -tikki- PHP Code: <tr> <td colspan="3" rowspan="2"> <img src="imagesxx/small_blank.png" width="234" height="83" alt=""></td> <td> <img src="imagesxx/spacer.gif" width="1" height="74" alt=""></td> </tr> i have the script needed http://www.dynamicdrive.com/dynamici.../carousel2.htm Code: <table width="400" border="2" class="pay" id="pay"> <col class="itemsDesc" /> <colgroup span="2" class="firstCol" /> <colgroup span="1" class="feeCol" /> <thead> <tr> <th>Lessons</th> <th>Per Term</th> <th>Per Year</th> </tr> </thead> <tbody> <td>30 minutes</td> <td>$600</td> <td>$1100</td> </tr> <tr> <td>45 minutes</td> <td>$850</td> <td>$1600</td> </tr> <tr> <td>60 minutes</td> <td>$1100</td> <td>$2100</td> </tr> </tbody> </table> and my css: Code: * {margin: 0px; padding: 0px} body {font-size: 14px; font-family: 'Lucida Grande', Verdana, sans-serif} table.pay {table-width: 400px; border: 10 px outset rgb(68, 76, 169)} table.pay thead {background-color: ivory; border: 1px} table.pay col.firstCol {background-color: rgb(255, 255, 192)} table.pay col.feeCol {background-color: rgb(232,232,255)} table.itemsDims {width:12%;} im supposed to create a heading row group, a body row group, and column groups containing one column element belonging to the firstCol class, and another column element belonging to the feeColumns class which should span two columns in the web table. was just wondering where im going wrong here since when i do my css.. the background colors or no changes seem to be applied to the columns or the headers (thead) I'm starting a forum here, and I really want to get it up soon. But I can't because I'm having trouble w/ the header. On the header there's supposed to be text on top of it, but it's not. It's on the side. Can anyone help? Thank you. Here's the code:
Code: <a name="top"></a> <table cellspacing="0" cellpadding="0" border="0" width="696px" align="center"> <tr> <td bgcolor="#ddeef7"> <table border="0" cellspacing="1px" cellpadding="6" width="100%"> <tr> <td width="74%" bgcolor="#ffffff"> <table border="0" width="100%" cellpadding="0" cellspacing="0"> <tr> <td valign="top" rowspan="2"><a href="index.php"><img src="./images/oxygen/logo.png" alt="Ne-YoFan.com Online Community" border="0" /></a></td></tr> <tr> <td align="right" valign="top"><font class="smalltxt">Last active: 14-6-2008 at 08:10 PM<br /></font></td> </tr> <tr> <td align="right" valign="bottom"><font class="smalltxt">Logged in as <a href="member.php?action=viewpro&member=Erika">Erika</a><br />[<a href="misc.php?action=logout">Logout</a> - <a href="u2u.php" onclick="Popup(this.href, 'Window', 700, 450); return false;">U2U</a> - <a href="memcp.php">User Control Panel</a> - <a href="cp.php">Administration Panel</a>]</font></td> </tr> </table> Hello everyone. I am trying to make a table based layout for my personal site, and I have run into a problem with my layout images. My issue is this: is there a way you can make the top of a table flush with the top of the page? I want it so there is no gap between the top of my table and the top of the page. I"m wondering how to get that done. I hope someone can help. Back in 2004, i created a site, with tables. Have no idea how I did it, someone must have helped me. I want to update that site and make the center section wider than the sides (the sides can be of equial width). The URL is http://www.ilovejesus.com/lot/awesomebks/news.shtml Can someonehelp me with this? I need the code from the beginning of the table to the end of that column, that is Column 1, (left side) back to top for Column 2 (center), back to top for Column 3 (right side) and to the bottom of that column. I would like the center column to be at least 2x as wide as the side columns. Tell me how to end the tables and begin the text which will be straight across page. Thanks. I've been having some issues with my site. It looks fine in IE but it doesn't look correct in Firefox, Opera and Safari. The tables are misaligned and I am at a total loss. Can anyone help me out. Thanks here is the link; http://wwwdotcapleeconsultingdot.com Hello everyone. Im making a website for my company and i need a little help. I made a table and tried to put a fixed width on it so then I could put text in it. Problem is, -when i type with no spaces ex aaaaaaaaaaaaa the text just keeps going forever instead of dropping down to the next line Also Ive been having some other problems -if I zoom in to like 200% on IE my text doesnt stay centerd with the page, it stays centered with the screen -And if I zoom in really far in Fire Fox my background stays centered with the screen instead of the page I made the page using photoshop and exported as html to get me started so ill post the whole script. Its not a whole lot. --------------------------- <html> <head> <title>K2 Layout 3-0</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> body { background-image: url(images/bg2.jpg); background-repeat: repeat-y; background-position: center; background-color: #0d141e; } body,td,th { color: #FFF; } </style> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <!-- Save for Web Slices (K2 Layout 3-0.psd) --> <center> <table id="Table_01" width="1024" height="225" border="0" cellpadding="0" cellspacing="0"> <tr> <td rowspan="4"> <img src="images/K2-Layout-3-0_01.gif" width="93" height="225" alt=""></td> <td colspan="6"> <img src="images/K2-Layout-3-0_02.gif" width="840" height="166" alt=""></td> <td rowspan="4"> <img src="images/K2-Layout-3-0_03.gif" width="91" height="225" alt=""></td> </tr> <tr> <td colspan="5"> <img src="images/K2-Layout-3-0_04.gif" width="714" height="1" alt=""></td> <td rowspan="2"> <img src="images/K2-Layout-3-0_05.gif" width="126" height="43" alt=""></td> </tr> <tr> <td> <img src="images/K2-Layout-3-0_06.gif" width="71" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_07.gif" width="211" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_08.gif" width="141" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_09.gif" width="163" height="42" alt=""></td> <td> <img src="images/K2-Layout-3-0_10.gif" width="128" height="42" alt=""></td> </tr> <tr> <td colspan="6"> <img src="images/K2-Layout-3-0_11.gif" width="840" height="16" alt=""></td> </tr> </table> <table id="Table_02" fixed width="830" border="0" cellpadding="0" cellspacing="0"><tr><td> Text Here Text Here Text Here Text Here </td></tr> </table> </center> <!-- End Save for Web Slices --> </body> </html> -------------------- Any help at all appreciated Thanks |