|
HTML - Complex Table
This table contains 4 columns and 5 rows.
I tried it but felt. I am sending you link of that table. http://sites.google.com/site/1024768images/Home Please resolve my problem Thanks Similar TutorialsI am attempting to put some things together, for my MySpace, and I can not figure out what I am doing wrong on one of these things, and I am completely lost on what to do regarding the second thing (of which I shall make another thread about labeled "Complex challenges Part 2"... I am hoping that someone here can help me, as the on the MySpace forums, I have been blatantly ignored... The first thing I am trying to accomplish is this... I have the speaker here... and the cat here... The code for video display is as follows... Code: <center><p style="visibility:visible;"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="350" width="450" align="middle" border="0" data="http://assets.myflashfetish.com/swf/video/lcd.swf"> <param name="allowScriptAccess" value="never" /> <param name="allowNetworking" value="internal" /> <param name="movie" value="http://assets.myflashfetish.com/swf/video/lcd.swf" /> <param name="quality" value="high" /> <param name="wmode" value="transparent" /> <param name="flashvars" value="myid=87517&path=2008/08/18&mycolor=D13272&mycolor2=000000&mycolor3=E1FF00&autoplay=false&rand=true&f=&vol=100&pat=5&grad=true" /> </object></center><br /> Now here is my problem, I was trying to accomplish what you see in the first picture, by modifying the code Code: <center><img src= http://i35.tinypic.com/282gpya.jpg><img src= http://i38.tinypic.com/2emnzvk.jpg><p style="visibility:visible;"><object type="application/x-shockwave-flash" allowScriptAccess="never" allowNetworking="internal" height="350" width="450" align="middle" border="0" data="http://assets.myflashfetish.com/swf/video/lcd.swf"> <param name="allowScriptAccess" value="never" /> <param name="allowNetworking" value="internal" /> <param name="movie" value="http://assets.myflashfetish.com/swf/video/lcd.swf" /> <param name="quality" value="high" /> <param name="wmode" value="transparent" /> <param name="flashvars" value="myid=87517&path=2008/08/18&mycolor=D13272&mycolor2=000000&mycolor3=E1FF00&autoplay=false&rand=true&f=&vol=100&pat=5&grad=true" /> </object><img src= http://i35.tinypic.com/282gpya.jpg></center><br /> But instead of getting what is in the picture... like (speaker cat (on top) video display speaker) I get it all spaced out like... speaker paragraph break cat paragraph break video display paragraph break speaker Can some one please explain what I am doing wrong here code wise and how I can go about fixing it so that I can have the desired effect that I have displayed in the first picture that I have provided. I would appreciate any sort of help on the matter, as I am truely frustrated. Thanks guys. Ok the second challenging task... This one I am so baffled by, I am told that it is possible to accomplish, but I can't make heads or tails of how to do it at all... I am again, hoping that someone here can help me, as the MySpace forums are ignoring me for the most part... Ok I hope I can explain what I am trying to accomplish, in a way that someone can help me achieve the desired effects. So here goes... I am working with some hover effects and imagery... I am starting off with two pictures. and Here is the code I am using: Code: <center><style>
a.letsRoll {width:150px; height: 300px; display:block;
background-image:url(http://i35.tinypic.com/23ww3k3.png);}
a.letsRoll img {border:0px;}
a.letsRoll:hover {cursor:default;}
a.letsRoll:hover img {visibility:hidden;}
</style>
<a class="letsRoll" href="#">
<img src="http://i38.tinypic.com/20hsgup.png" />
</a></center>
All this code does is switch my pictures from smirking to a toothy grin. Which is exactly what I was trying to do in the first place. Now here is where I am stumbling and having an aneurysm due to frustration... I want to do a side pop-up as well as the grin change upon hover, I was told that it can be done... People have provided me with this link... but I do not understand how to change it from links to pictures to give me my desired effects... Here's the link maybe someone can understand it and tell me how to change the code, because I don't... http://views-under-construction.blog...r-myspace.html What I want exactly is this... Upon hovering, the smirk changes to the toothy grin, and then at the same time a pop up (that was invisible until the hover, but will then stay visible upon moving the mouse cursor over to the right after it shows up) of a smaller picture... This is the picture that I would like to use. Now underneath it, I would like a link to a website... The link is... http://www.hide-city.com/ But instead of actually showing the link, I want it hidden, with text that reads... "hide's Official Website" instead. I would also like the pop-up (the little "Pink Spider" picture plus the link to hide-city) to be enclosed inside a solid or outset colored (the color I want is #ff00cc) border. See, when I said it was complex... I wasn't kidding... well it's complex to me anyway... As I said in the other "challenge" thread, I have asked around, and have been ignored... I am hoping in coming back here, my experience will be different. Thanks guys. Hi. I have NO experience with website building, but i need to build a site. I am using wix and I think it's turning out pretty well. However, I now need to create a box for people to fill out specific info for others to see. Ill explain what it'd look like, and hopefully you have the time to post a code??? thanks a lot if you do. It's look like this: We need: (here we would post for others to see what we need. somehow i guess i need to have administrator privileges to edit what is said. For example, "We need a baseball bat.") People see that then they need to "check" the box next to it to say they have it, and the click "okay". When they click okay i want it to link them to a login page where they fill out contact info(address, phone, email, date of availability, etc) once they do that then i want the box to appear shadowed/crossed out/whatever so that others viewing the site don't check the same box that someone else checked. Hope that makes sense. Thats the basic idea of it. All help is so greatly appreciated. Thanks a lot! Hi! This isn't really a technical issue so much as just a plea for a little advice on how to handle this. There may be some technical solutions to help me out, but I don't know of any. I am currently working on a website for clients who happen to be very very particular about EVERYTHING. I have run into a bit of an issue and am confused as to how to solve this. Maybe you all could help me out? Lend some advice, tell me what you'd do if you were me, etc... I am going to start from the beginning. The people I'm designing for are architects that design 5 million dollar homes. They wanted a clean design with a gradient background and it took us a long time to get to the background we came to. The problem with the background is that although I designed for 1024x768 (it also displays well at resolutions up to 1440x900), my clients are working on computers with large monitors with a much higher resolution. As a result, the browser window gets stretched so far that the gradient background image isn't large enough to cover and begins to tile itself. Here is an example of one of the pages, the photo gallery, on the website. http://aciwebsites.com/dev/vanBrouck/photo.html I am in the process of trying to fix some things so I wouldn't suggest clicking around too much. Now, notice that I use PNG in my design. I had to find a way around that, as my clients wanted an HTML website (not a Flash website) with semi-opaque graphic elements and IE doesn't support PNG files. The code I use works on single images but will not work on tiled background images (I needed to use a tiled semi-opaque PNG on the sub nav and body content section backgrounds so the gradient background could show through slightly)...So I had to find a way around that as well. I ended up slicing up the background gradient image at the appropriate places in photoshop and changing the lightness on it so that when placed as the background image in the div layer, it would appear to be just a semi-opaque box with the gradient showing through. But really, it's just a jpg. (I know this is really confusing. I'm trying my best to just write it all out and explain it the best I can.) So. What my clients are seeing on their high-resolution screens is a lot of empty space filled with this tiled gradient background. This is what I need to do: Remedy the background gradient situation so that the background is no longer tiled. Why I can't decide how to do this: 1 - Stretching the background to fit the screen using a background div layer (code on how to do that he http://www.htmlcodetutorial.com/help/ftopic4503.html) will interfere with the background images in the "subnav" and "body content" boxes which were cut at specific points in Photoshop and placed within the backgrounds of the div layers as a sort of faux-opaque div layer. Basically, it'll just mess everything up and won't look right anymore. 2 - I really can't mess much with this background image. My clients are very happy with it as it is. I considered possibly messing with it a little so that it fades to one solid color at both edges and I think this may be my best bet. However, doing this would take a very very long time, as I'd have to go in and change the backgrounds on all of the pages as well as go into Photoshop and redo all the faux opaque backgrounds. 3 - I could also use javascript to automatically resize the browser window upon page load, but I often find that to be annoying and I can see how it won't go over very well with these people. Another problem is that because they're looking at this website at such a high resolution, the page content is smaller than they'd like it to be. But they don't seem to understand that their resolution is in the minority and I don't quite know how to explain to them that I optimized the website to fit on MOST screens. They just don't seem very confident about this and I feel like I'm misleading them or doing something wrong. What do you all think? I know this was a bit long-winded, but if you're up for a challenge or just feel like throwing some ideas around, feel free to take a look at the website page and go through my code. Thanks for your time. 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 would like to know if there is such a thing as a tag within a table, that can collapse if the next table within that prior one gets too big to center? Here is an example of a part of my code: Code: <table style="width:757; border-style:solid; border-width:thin; margin:0 0 15px 0">
<tr><td class="spb-category" width="750" style="text-align:left;" colspan="3">Title of this category</td></tr>
<tr>
<td valign="top" width="33%">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=103">large size book title with author</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=187">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=197">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
</table> </td>
<td valign="top" width="33%">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=101">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=188">small sized book</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=120">Medium sized boot title</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
</table> </td>
<td valign="top" width="33%">
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr><td width="100%" onmouseover="this.style.background='#ddddff';" onmouseout="this.style.background='#ffffff';"><table border="0" cellpadding="0" cellspacing="0"><tr><td class="spb-book"><a href="product_info.php?products_id=102">a very long title of a book which includes the author</a></td></tr><tr><td class="spb-author">Author</td></tr></table></td></tr>
</table>
</td>
</tr>
</table>
1. I want to center each column so that the first letter of each book title is lined-up, but that the longest title on each column has equal space on both left and right. 2. If you look at each column, the width is about 245px. With regard to the first book title in the first column, I have 50px that is extra, therefore I'd like to automatically add 25px to the front of each one of the books for that column. 3. On the second column, there is about 80px extra, therefore I'd like to auto-add 40px to the front of each book in that column. My problem is that I don't want the column centered individually because then I will lose the straight line that I'd like each book to be on top of each other as it starts the line. I tried: style="margin-left:20px" and style="padding-left:20px" but when the title got too long it would not auto-collapse the left side, I want it to collapse! I want one tag that I can insert evenly on every section to get the push to the right an even amount of spaces for every book on each column. If it comes down to it, I wouldn't mind sacrificing that each column gets auto aligned to what is necessary for its own column. So if I have to use one number, say 30px, for the whole webpage, then ok, I'd do it. My problem is that sometimes the 30px empty filler space for the left, in order to push the title to the right, is not enough space for a very long title and it winds up sending half the title to the next line, which I don't want. This code is a list of books that spans about 20 categories and about 400 book titles. Thanks in advance for any help you might offer. The table itself is working fine, but the size of each cell is not correct in Firefox. Here is a screenshot of what is happening: http://img35.imageshack.us/img35/1938/tabletroubles.gif Here is the head of my page, the css for the table is he HTML Code:
<style type="text/css">
#cat table {border:0px solid #333333; cell-padding:0; cell-spacing:0; align=center}
#cat tr {align=center}
#cat td {font-size: 13px; font-family=tahoma; font-weight: bold; padding: 0px; border:0px solid #333333; align=center;}
#cat td a {text-decoration: none; color:#757575; background-color: white; display:block; height=23; background-image: url(linkbg1.gif); align=center;}
#cat td a:hover {background-color: #333333; font-weight: bold; text-decoration: none;color: #ffffff; background-image: url(linkbg2.gif); align=center;}
</style>
and here is the table code, located in the body of the page: HTML Code: <div style="Height:53px; overflow:auto; width:900px; position:absolute; top:0; left:0"> <TABLE bgcolor=#333333 cellspacing=0; cellpadding=0;><tr><td> <div id="cat"> <table width=900; cellpadding:0px; cellspacing:0px> <tr align=center> <td width=20%> <font face=tahoma><a href="home.html">Home</a></font> </td> <td width=20%><center><font face=tahoma><a href="openings.html" target="_top">Openings</a></font></center></td> <td width=20%><center><font face=tahoma><a href="dance.html" target="_top">Dance</a></font></center></td> <td width=20%><center><font face=tahoma><a href="projects.html" target="_top">Projects</a></font></center></td> <td width=20%><center><font face=tahoma><a href="vocaloid.html" target="_top">Vocaloid</a></font></center></td> </tr> <tr> <td width=20%><center><font face=tahoma><a href="fanflashes.html" target="_top">Fanflashes</a></font></center></td> <td width=20%><center><font face=tahoma><a href="caramelldansen.html" target="_top">Caramelldansen</a></font></center></td> <td width=20%><center><font face=tahoma><a href="cosplay.html" target="_top">Cosplay</a></font></center></td> <td width=20%><center><font face=tahoma><a href="endings.html" target="_top">Endings</a></center></td> <td width=20%><center><font face=tahoma><a href="anime.html" target="_top">Anime Episodes</a></font></font></center></td> </tr> </table> </div> </td></tr></table> </div> A table is nested within another table. The table on the outside has no content, it is there to make a gray border around everything else. If you look at the table in firefox & internet explorer, you'll see that in IE- the table is much thicker than in firefox. How can i make it so that the table in Firefox will have the same thickness as the one in IE? I could really use some help. Thanks! Here is an image depicting the trouble I'm having: I want to make a table, consisting of many cells. These cells would be fixed, and *very different* in sizes. It's easy to make a no-space table when all the images are exactly the same size, but when you have images with a variety of sizes, the table doesn't fit perfectly. Basically I want to create a collage of images with overlay text on each image. My idea was that I could create a table, and each cell (td) would have a background which is the image. Then I could just type in that cell, so the text would be over the image. Then I'd do this for every one of my images, and a collage would be formed. The problem is, the table makes large white spaces wherever the image sizes don't match! How do I get rid of these spaces, or is there an entirely different code/approach I should be using? Thanks! Here is my current code: HTML Code:
<html>
<head>
<style type="text/css">
table.nospace {
padding: 0; margin: 0;
border-collapse: collapse;
}
table.nospace tr {
padding: 0; margin: 0;
}
table.nospace td {
padding: 0; margin: 0;
}
</style>
</head>
<body>
<TABLE class="nospace" width="2040px" height="2000px" cellspacing="0px" cellpadding="0px">
<TR>
<td valign="top">
<table><tr>
<TD WIDTH="800px" HEIGHT="800px" BACKGROUND="image.jpg" VALIGN="bottom">
<h1><FONT COLOR=#ffffff>text</FONT></h1>
</TD></tr></table>
</td>
<td valign="top">
<table><tr>
<TD WIDTH="700" HEIGHT="497" BACKGROUND="image" VALIGN="bottom">
<h1><FONT COLOR=#ffffff>Text</FONT></h1>
</TD></tr></table>
</td>
<td valign="top">
<table><tr>
<TD WIDTH="700" HEIGHT="467" BACKGROUND="image.jpg" VALIGN="bottom">
<h1><FONT COLOR=#ffffff>Text</FONT></h1>
</TD></tr></table>
</td>
</TR>
</TABLE>
</body>
</html>
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 I have a list within a table and much of the content has links to two different javascript codes. One is a popup javascript to so that I can control the window size and the other is a toggle.display javascript to show/hide specific details about my list. The scripts run fine, but for some odd reason the content in my table gets cut off randomly towards the end of the list. I went through to make sure that I didn't have any div tags nested.. etc.. and i'm now at a complete loss as to why my content within the table gets randomly cut off. Any help would me much appreciated. The link for the site is he http://netimpact.org/displaycommon.c...rticlenbr=2440. You'll notice at the very bottom of the table it randomly stops.. Hi, i'm completely new with HTML. I'm making a website for a student activity group i'm in. We chose for me, because i had a little javascript experience. Thats more than most of us. Here goes the story. We are organizing a trip for other students. The students can enroll for the trip on the website. The form uses the following code; Code: <?php
$myFile = "enrollments.php";
$fh = fopen($myFile, 'a+') or die("can't open file");
$stringData ="<tr><td>".$_POST["name"]."</td><td>".$_POST["tel"]."</td><td>".$_POST["mail"]."</td><td>".$_POST["rnumber"]."</td><td>".$_POST["shirt"]."</td><td>".$_SERVER['REMOTE_ADDR']."</td><td>".date("d-m, G:i:s")."</td></tr>\n";
fwrite($fh, $stringData);
fclose($fh);
?>
Named post.php The code results in a simple file with only <tr>info</tr><tr>info2</tr>. Another page uses the following code to show the enrollments Code: <table id='enrollments'><tr><th>Name</th><th>Tel</th><th>Mail</th><th>Reknumber</th><th>Shirt</th><th></th><th>IP</th><th>Time</th></tr>
<?php include('enrollments.php'); ?>
</table>
named showenroll.html Right. So far so good. Now we'd like to show the students which are thinking about enrolling howmany other students already have enrolled. In other words, i'd like to count the number of rows in the "showenroll.html" and display that in the index.html. Ive found trough google the var (document.getElementById('ID')). However, i'm not able to add this var to the index.html, and direct it to a element ID on another page. As most newbs would do, i've tried document.getElementById('./showenroll/enrollments') I'm wondering if anyone could tell me how i can direct the document.getElementById to an element id that is not on the same page. And, if this is impossible, how i can make a counter of the enrollments Drayn p.s. ive tried to search this forum on table row counter, but it didn't provide the right solution(s?) for me. I have a table and after I select the question (the ball) I would like the answer to come up in another column in that table. Is that too much? Keep'er simple please. Thanks. the bold stuff is what i added in to try and make it sortable and it didn't work. Code: <?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"><head><meta http-equiv="content-type" content="text/html; charset=utf-8" /><title />
<link rel="stylesheet" type="text/css" href="example.css"/>
<meta name="author" content="my name" />
<link href="http://www.joostdevalk.nl/" rev="made" />
<script type="text/javascript" src="sortable.js"></script><meta name="generator" content="StarOffice/OpenOffice.org XSLT (http://xml.openoffice.org/sx2ml)" /><meta name="author" content="my name" /><meta name="created" content="2007-04-03T18:49:47" /><meta name="changedby" content="Ryan Gleason" /><meta name="changed" content="2007-05-04T16:38:49" /><base href="." /><style type="text/css">
@page { }
table { border-collapse:collapse; border-spacing:0; empty-cells:show }
td, th { vertical-align:top; }
h1, h2, h3, h4, h5, h6 { clear:both }
ol, ul { padding:0; }
* { margin:0; }
*.ta1 { }
*.ce1 { font-family:Arial; border-bottom-width:0.0351cm; border-bottom-style:solid; border-bottom-color:#000000; border-left-style:none; border-right-width:0.0133cm; border-right-style:solid; border-right-color:#000000; border-top-style:none; font-weight:bold; }
*.ce2 { font-family:Arial; border-bottom-width:0.0351cm; border-bottom-style:solid; border-bottom-color:#000000; border-left-width:0.0133cm; border-left-style:solid; border-left-color:#000000; border-right-width:0.0133cm; border-right-style:solid; border-right-color:#000000; border-top-style:none; font-weight:bold; }
*.Default { font-family:Arial; }
*.Heading { font-family:Arial; text-align:center ! important; font-size:16pt; font-style:italic; font-weight:bold; }
*.Heading1 { font-family:Arial; text-align:center ! important; font-size:16pt; font-style:italic; font-weight:bold; }
*.Result { font-family:Arial; font-style:italic; font-weight:bold; text-decoration:underline; }
*.Result2 { font-family:Arial; font-style:italic; font-weight:bold; text-decoration:underline; }
*.co1 { width:1.3516in; }
*.co10 { width:0.7854in; }
*.co11 { width:0.5681in; }
*.co12 { width:0.8925in; }
*.co2 { width:0.9925in; }
*.co3 { width:0.6984in; }
*.co4 { width:0.622in; }
*.co5 { width:0.372in; }
*.co6 { width:0.3827in; }
*.co7 { width:0.9055in; }
*.co8 { width:0.6661in; }
*.co9 { width:0.6772in; }
*.ro1 { height:0.1783in; }
</style></head>
<body dir="ltr">
<table class="sortable" id="anyid" cellpadding="0" cellspacing="0">
<table border="0" cellspacing="0" cellpadding="0" class="ta1">
<colgroup><col width="150" /><col width="110" /><col width="78" /><col width="69" /><col width="41" />
<col width="42" /><col width="101" /><col width="110" /><col width="74" /><col width="78" /><col width="75" /><col width="75" /><col width="75" /><col width="87" /><col width="63" /></colgroup>
that should be what you need..i exported an excel file as an xhtml file and read the source code and that's how it was, real unorganized and such. basically it's got stats of baseball players and i want to make them easily sortable. i created a sortable table using another piece of code but have to manually enter everything in if i do it that way. It's hard to explain, but basically I want to achieve creating a smaller file looking portion of my site, with a larger around and tabs. Basically this: I currenty just have the outer red table, using .gif's to round the corners. I tried copying the code again to place in the middle of the red table code and it doesn't work. Any help to achieve this effect would be great. Here is the code I am using: PHP Code: <table width="450" cellpadding="0" cellspacing="0" border="0" style="background-color: #086591"> <tr> <td width="14"><img src="images/top_left.jpg" width="14" height="14" border="0" alt="..." /></td> <td width="172"></td> <td width="14"><img src="images/top_right.jpg" width="14" height="14" border="0" alt="..." /></td> </tr> <tr> <td></td> CONTENT HERE <td></td> </tr> <tr> <td><img src="images/bottom_left.jpg" width="14" height="14" border="0" alt="..." /></td> <td></td> <td><img src="images/bottom_right.jpg" width="14" height="14" border="0" alt="..." /></td> </tr> </table> Thanks for any help. Is it possible? Hi All, I would like to put the following tables within another table... any ideas? PHP Code: <?php session_start(); if(!isset($_SESSION['user'])) header( "Location: ../index.php" ); ?> <html> <head> <style type="text/css"> body { background: url(paper.jpg) fixed center no-repeat;} </style> </head> <body bgcolor="333333"> <body> <div align="center"> <center> <table border="2" bordercolor="" cellpadding="3" width="713" height="1"> <tr> <td width="250" height="200" bgcolor="#FFFFFF" valign="middle" align="center" bordercolor="#000000" bordercolorlight="#000000" bordercolordark="#000000"><a href="list_quotes.php?building=1275_Elgin_Street"><img src="1275Elgin.jpg"></a> </td> <td width="4" height="200" valign="middle" align="center"></td> <td width="250" height="200" bgcolor="#FFFFFF" valign="middle" align="center" bordercolor="#000000" bordercolorlight="#000000" bordercolordark="#000000"><a href="list_quotes.php?building=1230_White_Oaks_Blvd"><img src="1230white.jpg"></a></td> <td width="4" height="200" valign="middle" align="center"></td> <td width="250" height="200" bgcolor="#FFFFFF" valign="middle" align="center" bordercolor="#000000" bordercolorlight="#000000" bordercolordark="#000000"><a href="list_quotes.php?building=620_Lolita_Gardens"><img src="620Lolita.jpg"></a></td> </tr> <tr> <td width="250" height="25" bgcolor="#ECE9D8" valign="middle" align="center" bordercolor="#000000" bordercolorlight="#000000" bordercolordark="#000000"><b><a href="list_quotes.php?building=1275_Elgin_Street">1275_Elgin_Street</a></b></td> <td width="4" height="25" valign="middle" align="center"></td> <td width="250" height="25" bgcolor="#ECE9D8" valign="middle" align="center" bordercolor="#000000" bordercolorlight="#000000" bordercolordark="#000000"><b><a href="list_quotes.php?building=1230_White_Oaks_Blvd">1230_White_Oaks_Blvd</a></b></td> <td width="4" height="25" valign="middle" align="center"></td> <td width="250" height="25" bgcolor="#ECE9D8" valign="middle" align="center" bordercolor="#000000" bordercolorlight="#000000" bordercolordark="#000000"><b><a href="list_quotes.php?building=620_Lolita_Gardens">620_Lolita_Gardens</a></b></td> </tr> </table> </center> </div> <div align="center"> <center> <table border="0" cellpadding="2" cellspacing="0" width="712"> <tr> <td width="704"> <p align="center"><b></font></b></td> </tr> </table> </center> </div> <p align="center"><font face="Algerian" size="5"> </font></p> </body> </html> I have a website I am working on he http://www.cliffmccormick.com/New/home.html and I need the site to fill 100% of the browser window. The problem is that the table has 4 rows, as you can see by the 4 different colored sections (ignoring the white at the bottom). I have found code to make the table height 100%, but the problem is when it does this, it ignores the pixel heights I have specified. I need the middle area with the picture of the face to expand freely, but I need the other 3 rows to remain the pixel heights I specify. So, the area with the face I do not specify a height. and I thought that would mean that it would be the only row to expand, but this is not the case. I have tried lots of things, and am out of ideas. Can anyone help me? Two questions about embedding a table within a table: 1, For some reason when I put a new table in the cell of an existing table, the table will always appear as verically justified in the center rather than the top. How do i change this so that the table appears in the top of the cell? 2, I am using dreamweaver, I have 2 tables embedded in different cells of an existing table, the code works fine when I play the page in a web browser, but I cannot see the tables in design view of dreamweaver, this has never happened to me before. Any idea why this is happening and how to fix it? Help please- I'm trying to put an input box into a table with a background. However, when I do- the background keeps enlarging even though the text inside of it fits inside perfectly. Look: HTML Code: <TABLE background="http://www.uzumakiworld.com/uzuvideo/tabletoptab.gif" border= 0px; cellspacing=0 height=26px width=289px" align="center">
<td>
<script>
<!-- Hide from old browsers
/******************************************
* Find In Page Script -- Submitted/revised by Alan Koontz (alankoontz@REMOVETHISyahoo.com)
* Visit Dynamic Drive (http://www.dynamicdrive.com/) for full source code
* This notice must stay intact for use
******************************************/
// revised by Alan Koontz -- May 2003
var TRange = null;
var dupeRange = null;
var TestRange = null;
var win = null;
// SELECTED BROWSER SNIFFER COMPONENTS DOCUMENTED AT
// http://www.mozilla.org/docs/web-developer/sniffer/browser_type.html
var nom = navigator.appName.toLowerCase();
var agt = navigator.userAgent.toLowerCase();
var is_major = parseInt(navigator.appVersion);
var is_minor = parseFloat(navigator.appVersion);
var is_ie = (agt.indexOf("msie") != -1);
var is_ie4up = (is_ie && (is_major >= 4));
var is_not_moz = (agt.indexOf('netscape')!=-1)
var is_nav = (nom.indexOf('netscape')!=-1);
var is_nav4 = (is_nav && (is_major == 4));
var is_mac = (agt.indexOf("mac")!=-1);
var is_gecko = (agt.indexOf('gecko') != -1);
var is_opera = (agt.indexOf("opera") != -1);
// GECKO REVISION
var is_rev=0
if (is_gecko) {
temp = agt.split("rv:")
is_rev = parseFloat(temp[1])
}
// USE THE FOLLOWING VARIABLE TO CONFIGURE FRAMES TO SEARCH
// (SELF OR CHILD FRAME)
// If you want to search another frame, change from "self" to
// the name of the target frame:
// e.g., var frametosearch = 'main'
//var frametosearch = 'main';
var frametosearch = self;
function search(whichform, whichframe) {
// TEST FOR IE5 FOR MAC (NO DOCUMENTATION)
if (is_ie4up && is_mac) return;
// TEST FOR NAV 6 (NO DOCUMENTATION)
if (is_gecko && (is_rev <1)) return;
// TEST FOR Opera (NO DOCUMENTATION)
if (is_opera) return;
// INITIALIZATIONS FOR FIND-IN-PAGE SEARCHES
if(whichform.findthis.value!=null && whichform.findthis.value!='') {
str = whichform.findthis.value;
win = whichframe;
var frameval=false;
if(win!=self)
{
frameval=true; // this will enable Nav7 to search child frame
win = parent.frames[whichframe];
}
}
else return; // i.e., no search string was entered
var strFound;
// NAVIGATOR 4 SPECIFIC CODE
if(is_nav4 && (is_minor < 5)) {
strFound=win.find(str); // case insensitive, forward search by default
// There are 3 arguments available:
// searchString: type string and it's the item to be searched
// caseSensitive: boolean -- is search case sensitive?
// backwards: boolean --should we also search backwards?
// strFound=win.find(str, false, false) is the explicit
// version of the above
// The Mac version of Nav4 has wrapAround, but
// cannot be specified in JS
}
// NAVIGATOR 7 and Mozilla rev 1+ SPECIFIC CODE (WILL NOT WORK WITH NAVIGATOR 6)
if (is_gecko && (is_rev >= 1)) {
if(frameval!=false) win.focus(); // force search in specified child frame
strFound=win.find(str, false, false, true, false, frameval, false);
// The following statement enables reversion of focus
// back to the search box after each search event
// allowing the user to press the ENTER key instead
// of clicking the search button to continue search.
// Note: tends to be buggy in Mozilla as of 1.3.1
// (see www.mozilla.org) so is excluded from users
// of that browser.
if (is_not_moz) whichform.findthis.focus();
// There are 7 arguments available:
// searchString: type string and it's the item to be searched
// caseSensitive: boolean -- is search case sensitive?
// backwards: boolean --should we also search backwards?
// wrapAround: boolean -- should we wrap the search?
// wholeWord: boolean: should we search only for whole words
// searchInFrames: boolean -- should we search in frames?
// showDialog: boolean -- should we show the Find Dialog?
}
if (is_ie4up) {
// EXPLORER-SPECIFIC CODE revised 5/21/03
if (TRange!=null) {
TestRange=win.document.body.createTextRange();
if (dupeRange.inRange(TestRange)) {
TRange.collapse(false);
strFound=TRange.findText(str);
if (strFound) {
//the following line added by Mike and Susan Keenan, 7 June 2003
win.document.body.scrollTop = win.document.body.scrollTop + TRange.offsetTop;
TRange.select();
}
}
else {
TRange=win.document.body.createTextRange();
TRange.collapse(false);
strFound=TRange.findText(str);
if (strFound) {
//the following line added by Mike and Susan Keenan, 7 June 2003
win.document.body.scrollTop = TRange.offsetTop;
TRange.select();
}
}
}
if (TRange==null || strFound==0) {
TRange=win.document.body.createTextRange();
dupeRange = TRange.duplicate();
strFound=TRange.findText(str);
if (strFound) {
//the following line added by Mike and Susan Keenan, 7 June 2003
win.document.body.scrollTop = TRange.offsetTop;
TRange.select();
}
}
}
if (!strFound) alert ("String '"+str+"' not found!") // string not found
}
// -->
</script>
<!-- EXAMPLE FORM OF FIND-IN-PAGE SEARCH USING SUBMIT (ALLOWING 'ENTER/RETURN' KEY PRESS EVENT) -->
<form name="form1" onSubmit="search(document.form1, frametosearch); return false"> <b><font size=2><font color=white><font face=tahoma>Anime:</font></font></a></b></font></font></font> <input type="text" name="findthis" value="Search for Anime" size="15" style="height:18px;font-size:9px;" title="Press 'ALT s' after clicking submit to repeatedly search page"> <input type="submit" value="Search!" style="height:18px;font-size:9px;" ACCESSKEY="s"></form>
</td></tr></table>
See, I got the Search script from DYNAMIC DRIVE, and it works amazingly- I just need to make it so it fits properly into the table. Help! Thanks for reading my post! Hi all. New to the forum. I know basic html, I'm trying to put together my website. its for carpet laying and doesn't need much content, mainly just to show my contact details etc. Just wondering how you do a table like the one in this image? as the basic ones look a bit dull. i cant get rid of the 3d shape or change border color/shape thankshttp://img516.imageshack.us/my.php?image=tblrm4.jpg |
|||||||