|
HTML - Table Not Working Correctly
I want to know why the following code doesn't work correctly:
Code: <table>
<tr>
<td rowspan="2">Square</td>
<th colspan="2">Title</th>
</tr>
<tr>
<td colspan="2">Information</td>
</tr>
<tr>
<td colspan="3">Long description fits in here.</td>
</tr>
<tr>
<td colspan="2">Why, oh why?</td>
<td>pt</td>
</tr>
</table>
It should make a table with three columns, the third column is only really used in the bottom line. Is this just a problem with the way html is read or what. I presume this isn't just a browser issue, but in any case I'm using Firefox 2. Cheers. Similar TutorialsWell, this is the first CSS layout i've made, the site right now is EXACTLY how I want it to look, but I think somethings not right... if I fill up where it says "How about some links? " too far, the footer goes to the top of the page, and the "Welcome" ends up in the navigation menu Here is the link For the life of me I can't seem to figure out why this page jump isn't working. http://www.thegoheens.com/resources/test.html Any help is greatly appreciated. Thanks! I've just started changing my Tumblr page around to make it look more fancy! I put a nice background and such on it, then finally, after looking for hours, figured out how to make my posts container opaque, so that you could actually see the background. Well, when I made it opaque, it also made my posts opaque. So, now some of the photos I'm using on there are not extremely visible. I was just wondering if there's a way to make the post container opaque without making the post content opaque as well? Here's the link to my tumblr page, so you can get an idea of what I'm talking about. http://late-summers-thoughts.tumblr.com/ And I'm not totally sure that this is what you need, but this is the part of my coding where I made the whole thing opaque. div#content{filter: alpha(opacity=75); -moz-opacity:.75; opacity:.75; float:right; width:500px; padding:10px; padding-top: 0px; margin-right: 170px; background: #000000; } div#entry{ background-color:; margin-top:px; padding-top:10px; padding-bottom:10px; } Okay so I am working on a website and on the services page I used anchor tags to jump to places on the page. They all work great except for one. The page validates and I dont see anything any different from that markup to all the other markups I have done. It is up on a test server at www.vsncom.com/melkay/services.html The link thats not working is underneath the Electrical maintenance block and it is the link to go back to the top. Also on the entire site. The map page, contact, and services all shift slightly to the left. The pages all use the same css...any ideas? or is it just an optical illusion? Thank You, Matt It works correctly, but did I do it correctly to add color? I want the show/hide to be blue and the text to be red. <html> <head> <style type="text/css"> a.showandhide{ color: rgb(0,0,255); } body{ color: rgb(255,0,0); } </style> <title>Test hide thing from TIF T&C</title> </head> <body> <script type="text/javascript"> function showhide(id) { if(document.getElementById(id).style.display == 'none') { document.getElementById(id).style.display = 'block'; } else { document.getElementById(id).style.display = 'none' } } </script> <a href="javascript:void(0)" onclick="showhide('box')" class="showandhide">Show / Hide</a> <div id="box" style="display:none;"> Blah blah blah blah blah blah </div> </body> </html> Hi, I am creating a site in HTML using Dreamweaver. I use rollover buttons to navigate the site which are normally grey but white when rolled over. I have found that when I press the BACK button the button I had previously clicked is white and not grey. Try it out for yourself: http://www.RandAM.org/RichardAsh/ Once the problematic button is rolled over it works normally. Is there a way to stop this from happening? thanks, R 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>
Hello everybody, I'm writing here because I'm having a problem with Chrome resizing a table. I have a table representing one day (24 hours). In this table I draw activity bars using colspan. The precision for activities start/stop is 2 minutes, so I draw a table containing 30*24 <td/> tags. The table has 100% width as I want the chart to be resizable. The result is great in Firefox and IE8 (all columns resize the same way), but in Chrome, when downsizing page width, the columns resize one after the other, starting from the first. So the chart scale gets corrupted. Here is a sample code I used to reproduce the issue : Code: <html> <body> <table border="1" cellspacing="0" cellpadding="0" style="table-layout:fixed;width:100%;word-wrap:break-word;"> <tr> <td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/><td/> </tr> <tr height="30" valign="middle" align="left"> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex;">0h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">1h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">2h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">3h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">4h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">5h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">6h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">7h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">8h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">9h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">10h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">11h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">12h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">13h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">14h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">15h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">16h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">17h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">18h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">19h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">20h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">21h</div></td> <td colspan="30" align="left" style="border-right:1px solid #dddddd;"><div style="padding-left:1ex">22h</div></td> <td colspan="30" align="left"><div style="padding-left:1ex">23h</div></td> </tr> </table> </body> </html> Any idea about what's going on? Thank you very much for your help Stephane I will be brief in hoping that the issue does not require a thesis to properly fix. I'm dealing with tables within tables..within tables. In one instance, I have a 2x1 (row by column) table inside another table. So, we'll call the inside table "B" and the outside table "A". Table B is centered inside a column in Table A. I'm trying to maximize the space, but nearly nothing works. Setting Table B height=100% does nothing. The only thing that works is setting the height=N px, where N is a number. This is no good, as I want to the site to work on all resolutions. I want it to be proportional. How can I fix this? Here's what I'm dealing with, visually: Any help would be welcome. Thanks. I have a few sites. The one I'm working on now is giving me trouble and I really can't understand why. I just started it so it's mainly templates and stuff, but the banner at the top is made out of many img files put into a table. I've done this technique before and it worked fine but for some reason it will not work on this site. Basically I am getting a large white line through the top and bottom rows of images. Please help. Link to my site where the banner works: http://www.stevemedleyphotography.com Link to the site I started where the banner is not working: http://www.desyriarpg.com My table will not fill the window vertically completely, can anyone help? Code: <style type="text/css">
<!--
body {
margin:0;
padding:0;
background-color: #000000;
}
.sack {
padding-left: 100px;
vertical-align: middle;;
}
.style1 {color: #FFFFFF}
#fullheight {
height:100%
}
-->
</style>
<body>
<table id="fullheight" width="1502" height="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="1369" valign="middle" bgcolor="#666666"><div id="home"><img src="images/sack_black_main.gif" width="257" height="550" class="sack" /></td>
<td width="133"><span class="style1"><a href="#home">home</a></span></td>
</tr>
</table>
</body>
http://matc.studentsites.net/restorf...nal/index.html I can't get my bgcolor to display in the main content table. I tried adding it to the tr, td, and the style sheet. Nothing seemed to work. Works fine in IE and Opera. Any ideas? Edit: Also my text in the footer isn't formating. Hi there, I have a problem with two pages on my website; the right-nav images are not working (in IE7). I have checked the links in the code and they are set up correctly, however the links seem inactive once tested. They do work fine in Firefox. The links are nested in a table, that is inside another (main) table, and they are not set as background images for the cell. Please see http://www.centralbancmtg.com/test/contact.html to see what I am talking about. The links that do not work are the "Mortgage Brokers - Click Here", "Today's HOT Programs" and "Employee Login" located on the right column. The follwoing link has the same problem: "Todays' HOT Programs" (first 2/3rds of the image are not "clickable") on: http://www.centralbancmtg.com/test/brokers.html I am not an expert and need help immediately. I'm sure it's an easy fix but if you have a solution please let me know ASAP! Thank you! Hello everyone, I've been racing to learn html/css in the past couple weeks to throw up a website, and so far so good. But: I've searched the internet and I cannot find an answer to my questions. The page in question is: http://www.andrew.cmu.edu/user/jonmille/projects.html style sheet (relevant section is in the "Programming: List Settings" section) http://www.andrew.cmu.edu/user/jonmille/style.css You can see that the gray borders under the text/images have a small break in them. I assume it has something to do with the fact that I'm using two columns. How do I fix this and make a solid border (in a non hackish way)? Note: if you say "use css/divs," I wrestled with those for about two hours before I gave up and made a table. Secondly, in IE7, all the images/text are completely flushed left, ignoring the table padding. How can I fix this? Note, I've never checked this site in IE6 or below, and never will, so if it looks wrong in IE6, then the user doesn't deserve to see my site anyway. Thanks for your time! Jon Hello, I'm new here and I hope here is the best place to ask for help. Recently i found a piece of code on the net that will allow me to watch online different pictures. I have 499 folders and sorted them as 01 02 03 04 05 06 07 08 09 11 12 13 14 15 .... 100.....150.....350...499 but in my ftp client everything is messed up(filezilla) after i upload them on my server when i want to watch them .. the list appears like this: after folder no.10 i have folder no.100 and after folder 199 i have folder no.20 .. and so on .. how could i fix them so that the numbering would be correct ? I am a total newbie to this and so I have no idea what is going on. I downloaded a template from a wesite I forget which, but it looks great in IE, and Safari, however in Firefox, or Opera it is all screwed up. The site is www.ottersupport.com would somebody mind look at the code and let me know what i need to fix ? Thanks Guys, i am in a real bind here. I recently redesigned my website & gave it a fresh look. Well apparently that new look has come with a cost! My homepage doesn't display correctly in IE6 or IE7. I am getting a lot of complaints about it & I have no clue how to fix it. I added a script to inform users that they were using an older browser that was outdated but a lot of my users cannot update their browsers because they are on work computers & what not. Can someone please help me fix this mess. My homepage URL is: http://www.biglake411.com/ The site displays correctly using firefox & IE8. The problem is with IE6 & IE7. Here are screen shots of each: Thanks in advance. I have my code in short like this: Code: <div class="out">
<div class="first"></div>
<div class="second"></div>
</div>
.out{ width: 1000px; }
.first{ width: 500px; float: left; }
.second{ width: 500px; float: left; }
Suppose, 500 + 500 = 1000, which should fit in the outside div in one line. But my browser will make the second div into new line. I keep trying different numbers, and turns out around 500, 480 will fit in. Where is the missing 20 width? I also tried like margin: 0; border: 0;, still no luck. Thanks for your help. Hi, I have made a website that is scalable, but the problem is that it is not showing correctly in Internet Explorer. It works fine in Firefox. (2.x) site: http://www.haaga-helia.fi/~a0500249/pohja/index.html I don't know where the bug is. I ran it with w3c validator and it was fault free. Something to do with the css file, but I don't know where. Help is appreciated. Sincerely, Juha |
|||||||