Click to See Complete Forum and Search --> : Tables


roughdiam
05-07-2003, 07:53 AM
Can some kind person help me. I need to be shown how a TD element can be used to create a 50-pixel margin so that nothing on the Web page interferes with a background pattern that runs down the left side of the page. Also, how a table can be used to create a 10-pixel black border that runs down the entire left side of a Web page. Thanks

gil davis
05-07-2003, 08:16 AM
how a TD element can be used to create a 50-pixel marginMany wise people discourage using a table for layout. It would be easier to apply the margin to the body tag using CSS:<style type="text/css">
body {margin-left: 50px}
</style>
create a 10-pixel black border that runs down the entire left sideSame comment, different code:<style type="text/css">
body {border-left: 10px solid black}
</style>
The two can be combined:<style type="text/css">
body {margin-left: 50px; border-left: 10px solid black}
</style>

khaki
05-07-2003, 08:51 AM
hi Gill....

i just tried that....

:eek:

in N7 it applied the margin correctly, and it applied a left border up against my table.
it works as i would expect it too.

but....

in IE5.0 it applies the margin correctly, but the border runs along the entire window on the left side (100% height).


in Opera6.02 it applied the margin correctly, but the border is about 10 px to the left of the table.

:confused:
k

roughdiam
05-07-2003, 11:40 AM
Gil,
Thanks, but this is for an HTML assignment.

Charles
05-07-2003, 11:52 AM
Originally posted by roughdiam
Gil,
Thanks, but this is for an HTML assignment. Then note well the following:From the HTML 4.01 Specification:
Tables should not be used purely as a means to layout document content as this may present problems when rendering to non-visual media. Additionally, when used with graphics, these tables may force users to scroll horizontally to view a table designed on a system with a larger display. To minimize these problems, authors should use style sheets to control layout rather than tables.
http://www.w3.org/TR/html4/struct/tables.html#h-11.1

gil davis
05-07-2003, 11:56 AM
Originally posted by khaki
in IE5.0 it applies the margin correctly, but the border runs along the entire window on the left side (100% height).Same on IE 5.5. That is what I was expecting. NS 7 probably needs the body to have a height in order to apply a border. I'm not sure which is technically correct by W3C recommendations.in Opera6.02 it applied the margin correctly, but the border is about 10 px to the left of the table.No experience with Opera.

I expected the border to go all the way down the left edge of the page.

Just for grins, try this in Opera:
body {margin-left: 0px; margin-top: 0px; padding-top: 8px; padding-left: 50px; border-left: 10px solid black; height: 100%}It looks the same in IE 5.5 and NS 6, except there is a vertical scroll bar in NS 6.

gil davis
05-07-2003, 12:03 PM
Originally posted by roughdiam
this is for an HTML assignment.You would have to tell me what else is in the table.<body topmargin=0 leftmargin=0>
<table height=100% width=100% cellspacing=0 cellpadding=0>
<tr>
<td rowspan=2 bgColor=black width=10>&nbsp;</td>
<td rowspan=2 width=40>&nbsp;</td>
<td>This is some content</td>
</tr>
<tr>
<td>This is some more content</td>
</tr>
</table>
</body>

khaki
05-07-2003, 12:29 PM
hi roughdiam....

(you're gettin' no love here are you? lol)

okay...
i'm typing this on the fly on one of the town-library's internet-only PCs (with no benefit of even Notepad!)...
so check for typos or other errors ( :rolleyes: sorry... but the screen is really small too... and it's tough to self-edit :rolleyes: )

So to use an HTML table-only method...
you could use rowspan for both the black border and the margin (psuedo-margin).
sumthin' like so.......

<table>
<tr>
<td rowspan="3" width="10px" bgcolor="#000000"><&nbsp;</td>
<td rowspan="3" width="40px">&nbsp;</td>
<td width="600px">page content... or just &nbsp; ... or whatever</td>
</tr>
<tr>
<td>more page content or whatever</td>
</tr>
<tr>
<td>still more.... if you even need content in the table?</td>
</tr>
</table>

now, if i didn't mess that up...
Row1 Col 1 contains the border.
I made a 3 row table for this example (set your rowspan as necessary for your particular table setup)

Row1 Col2 finishes the width requirement to achieve 50px total (col1 + col2).

Any other columns that you need (this example has 3 total) can be used for content (whatever type that is... and i'm going to assume that the margin is for either an image of another nested table or something).

after that... it's up to you to add height attributes, additional
rows and/or columns... and whatever.

hopefully this gets you on your way...
(and hopefully i didn't mess this up.... although i'm sure that someone will be sure to tell me if i did :rolleyes: )

***
Gil...

I'll check that as soon as i get back home (i'm currently testing other stuff on the library's IE5.5 and IE6 browsers for work stuff. I'll do anything to keep from driving to the office for something as lame as browser-testing. lol)

let me know how/if that works for you roughdiam...
;) k

EDIT: ahhh!!! Gil beat me to the punch.
I really need to :
a) type faster
b) type less (lol)
:rolleyes:

spufi
05-07-2003, 02:34 PM
Charles, you have to understand that every college course I have taken has focused on HTML 4.0. CSS is handled very lightly and using tables for layout is the norm. Sad, but true. I'm sure roughdiam was only allowed certain types of code, so although we think table for layout is an incorrect way of doing things, it's correct for what's within the context of the course.

Charles
05-07-2003, 03:21 PM
If they're teaching that it's OK to use tables for layout in HTML 4 then they are lying and everyone should walk out of the class, laughing at the fool behind the podium.

DaveSW
05-07-2003, 03:29 PM
The whole point of being in the class is that they are learning about html. Otherwise, the only reason that they're in that class is for the qualification. Either way, why would they walk out? They won't know about using css 'cos they haven't been taught it right?? and their teacher seems unlikely to do so...

khaki
05-07-2003, 03:31 PM
Just for grins, try this in Opera..... hey Gil....

Opera seems to like that a lot better.

Looks the same on:
IE5.0 (no scroll)
Netscape7 (w/Vertical scroll)
Opera6.02 (w/Vertical scroll)

;) k

EDIT: oh jeez.... what the heck did i just step into the middle of? :eek:

Charles
05-07-2003, 03:33 PM
They should walk out because they are not learning HTML. In HTML 4 you do not use tables for layout. It says so right in the specification. The teacher is lying. And furthermore, the students are learning to make pages in a way that they will never pass accessibility guidelines. They may end up running themselves or their clients afoul of the law.

DaveSW
05-07-2003, 03:37 PM
If the teacher is teaching them something illegal the responsibility lies with the teacher. Therefore, the students could report him, until they know it's wrong they wouldn't think/know to do it. The teacher is the one in danger from the law.

Charles
05-07-2003, 03:41 PM
Yes the teacher should be reported, but the students ought to demand their money back, and more. They are owed for their wasted time. They paid for a service and they are not getting it.

lora_3677
05-07-2003, 03:50 PM
ok, i just have to jump in here... i just finished my web development degree... we did use css for design (SOME), not for layout... and sorry guys... but until all the browsers get up to speed and until everyone on the planet uses the most current browser... CSS for layout is still sort of a pain when going cross browser right now.. in the future it will continue to be improved....

not sure when the last time you took a class was... but you don't just get up and walk out if you want to pass the class or graduate...
AND unless you are working independently after graduation.. you will have to conform to the company's guidelines of how they want their coding done also...

it's easier when you are taking the course to just learn, without worrying about a degree...

khaki
05-07-2003, 03:51 PM
Originally posted by Charles
Yes the teacher should be reported, but the students ought to demand their money back, and more. They are owed for their wasted time. They paid for a service and they are not getting it. ya hear that roughdiam?...

where should they send the check? lol

self-teach or die (lol :) )

;) k