PDA

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

bloke
05-09-2003, 07:45 AM
Quick one. Can anyone tell me why my layout occassionally disjoints (the odd cell or row shifts to one side) but when I refresh it appears ok?

It's really starting to annoy the hell outta me!

Cheers
Charles
05-09-2003, 07:54 AM
BecauseFrom the HTML 4.01 Spec
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
lora_3677
05-09-2003, 09:37 AM
bloke: can you post the page so i can look at it. even though tables should not be used for layout, i'm guilty as well and i would be glad to help you.

also, give some info.. are you using any server side scripting or a style sheet or anything??
bloke
05-12-2003, 03:51 AM
Yeah, yeah. I know I should be using stylesheets but there you go. I aint re-writing it now!

I'm using frames out of necessity and here's the code for the main content frame:

vbscript, by the way.......

<body leftmargin="0" topmargin="20" marginwidth="0" marginheight="0"
style="scrollbar-3dlight-color: #009900;
scrollbar-arrow-color: #ffffff;
____ scrollbar-base-color: #008000;
________scrollbar-darkshadow-color: #003399;
________scrollbar-face-color: #003399;
________scrollbar-highlight-color: #ffffff;
____scrollbar-shadow-color: #ffffff;
________scrollbar-track-color: #F5F7F7;"
background="images/bgwaves.gif">
<link rel="stylesheet" href="stylesheet/lme.css" type="text/css">
<script language="javascript">
function openFile(jsVar)
{
window.open(jsVar, "File", "toolbars=no, scrollbars=yes, height=500, width=640, resizable=yes, left=50, top=50");
}
</script>

<!-- #include file="LAMdb.asp" -->
<%
Function nullDefault(strIn)
If strIn = "" or IsNull(strIn) Then
nullDefault = "default"
Else
nullDefault = strIn
End if
End Function


strSection = lcase(nullDefault(request.querystring("section")))

select case strSection
Case "default"
%>

<table border="0" cellspacing=0 cellpadding=0 width="97%" height="100%" background="images/mainbg.gif">
<tr class="newbody">
<td width="10" align="left"><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
<td valign="top" class="newbody"><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"><br>
<img src="images/lamheader.gif" width="155" height="20" alt="" border="0"><br><br>
blah blah blah
</td>
<td width="10" valign="top" align="right"><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"><br><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
</tr>
<tr>
<td width="10" align="left"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
<td valign="center" align="center" height="100%">

<img src="images/Image1.gif" width="360" height="254" alt="Teignmouth Outfall" border="0">
</td>
<td width="10" align="right"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
</tr>
<tr valign="baseline">
<td align="left" colspan="3"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"><BR><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"></td>
</tr>

</table>

<%Case "contact"%>
<!--#include file="contact.asp"-->

<%Case "world"%>
<!--#include file="images/globe.htm"-->

<%Case Else

strcontent = "sp_LAM_content "
strcontent = strcontent & request.querystring("ContID")

set connection = server.createobject("adodb.connection")
connection.open gstrConn

set rscontent = server.createobject("adodb.recordset")
rscontent.Open strcontent ,connection


%>

<table border="0" cellspacing=0 cellpadding=0 width="97%" height="100%" background="images/mainbg.gif" BGPROPERTIES="FIXED">
<tr height="30">
<td width="10" align="left"><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
<td valign="top" class="newheader"><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"><br>
<%If rscontent.eof then
Response.write "This section is currently unavailable"
Else
If request.querystring("section") = "preview" Then
response.write "PREVIEW<br><br>"
End If
Response.write rscontent("contentheader")
End If%>
</td>
<td width="10" valign="top" align="right"><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
</tr>
<tr>
<td width="10" align="left"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
<td valign="top" class="newbody">
<%If rscontent.eof then

Else%><br>
<% Response.write replace(replace(rscontent("contenttext"), "<ul>", "<UL TYPE=square>"), "^", "'")&"<br>"
response.write replace(rscontent("projectdetails"), "^", "'")
End If%>
</td>
<td align="right"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
</tr>



<tr>
<td width="10" align="left"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
<td valign="top" height="100%" align="center">
<%If rscontent.eof then%>
&nbsp;
<%Else
Response.write rscontent("sectionimage")
End If%>
</td>
<td align="right"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
</tr>

<tr height="5%">
<td width="10" align="left"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
<td>
<a href="" target="_top" class="blue">Home</a>
</td>
<td align="right"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>
</tr>
<tr valign="baseline">
<td align="left" colspan="3"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"><BR><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"></td>
</tr>
</table>

<%End Select%>
bloke
05-12-2003, 04:39 AM
Sorted it by replacing:

<td width="10" align="left"><img src="images/bluelineup.gif" width="100%" height="1" alt="" border="0"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>


with

<td width="10" align="left"><img src="images/bluelineup.gif" width="10" height="1" alt="" border="0"><img src="images/bluelineleft.gif" width="1" height="100%" alt="" border="0"></td>


Oh, I am a silly billy!
Vladdy
05-12-2003, 06:34 AM
Originally posted by bloke
<snip/>I'm using frames out of necessity <snip/>
There is no necessity that would require one to use frames. You are using them out of ignorance.
bloke
05-12-2003, 06:39 AM
Charming. The client wants frames. Therefore it is necessary.
Vladdy
05-12-2003, 08:08 AM
That's not a necessity, but a poor excuse. If you try to understand WHY your client wants frames, then explain him all the negative effects frames bring and show him how similar effect can be accomplished without frames, I sure he will change his mind.
bloke
05-12-2003, 08:13 AM
I'm building on an existing site. I don't go near frames as a rule as I am well aware that they are indeed rubbish.

Anyway, the problem is now resolved. Thanks for your input.
ashers
05-13-2003, 08:57 AM
What is wrong with using frames?
bloke
05-13-2003, 08:59 AM
They're a pain in the butt and often look rubbish. To be honest, I've managed to use them pretty much without problems but they aint my weapon of choice.
ashers
05-13-2003, 09:03 AM
I dont have a problem with them, they work fine, I know some people dont like them but thats a personal choice.
bloke
05-13-2003, 09:05 AM
Yeah, like I said, I've used them successfully but you're right - it's down to choice.
Charles
05-13-2003, 11:00 AM
From an accessibility standpoint frames are not so bad if they are implimented properly. And they're a great deal better than using tables for layout.
tobyw_1969
05-13-2003, 12:55 PM
I see so many rude, sneering, unexplained comments from 'professionals' about the 'rules', I feel the need to rant..

If you didn't use all the things people say are 'wrong' you wouldn't design a webpage that had anything on it at all. Frames, tables, background images, images in general (unless they are less than 1k), Flash menus, Flash in general, Shockwave movies, etc etc... I've heard people sneer at them all as 'not professional'.

When someone tells you that you shouldn't do something, it usually just means they've never tried to find a way of making it work that way. Everyone knows the best things are always done by people who don't know the 'rules'.


Everything is a matter of choice. Sometimes these things look crap - sometimes they look great. You simply can't design a webpage for every possible combination of browser / Processor / OS / screen resolution / window size / Mac or PC / connection speed / text size settings etc ...etc..

Well you can. But only if it is black text on a white background. Who wants to look at that?

Of course you want the page to look 'right' to the biggest audience possible, but you have to offset that against the cost, in design terms, of having to cater for someone running Unix on a Palmtop connected to the internet by a tin can and a piece of string.

If publishing firms thought like half the 'Web Developers' who come up with these sneers, they would never publish a book or magazine. Oooh..we can't use glossy paper, some people HATE glossy paper. Wait a minute..shouldn't we think about people who might not like the font size we are using? Can we be sure everyone reading this is actually sighted? What about a section in braille? And so on, and so on...

In my honest opinion, most of the pages I see developed by the 'professionals' are uniformly bland, are always totally hierarchical, lack 'browsability' and send you scurrying for something with some character.

The internet is like a second hand junk shop - it's NOT a nazi propaganda tool. The best websites have links all over the place, look a complete mess, but draw you in, help you navigate to where you want to go, and distract you with some really cool content on the way.
Personally I think the reason all these rude sneering professionals are in web forums being, well, rude and sneering, is 'cos they can't get work. And the reason they can't get work is because most people have realised that they can throw a webpage together themselves breaking all the 'rules', and still hit 90% of their target market - without having to pay someone to tell them that people in Mongolia with a valve-driven Commodore 64 might perceive that shade of white as 'apple blossom' rather than 'sea foam'.

My view as a user and developer is this. If I make a page and you can't see it in all it's glory - that's your tough ****. If I lose business as a result, that's my tough ****. I can live with it, and I don't care if you can't.

The chances are that most people can work out how to re-size their browser, use the scrollbar, or whatever. And if they can't....why worry? They would never have been able to work their credit card anyway.


Rant over.
khalidali63
05-13-2003, 01:07 PM
wholllly kamollie...

Though I agree with you...
the reality of the world is
different strokes for different folks..isn't it...

:D
nkaisare
05-13-2003, 02:36 PM
Rant well taken. Allow me to make a few points of my own.

When someone tells you that you shouldn't do something, it usually just means they've never tried to find a way of making it work that way.
Not necessarily. Some of the people who advice against the use of tables for layout are amongst the best brains in the industry, who know what they are talking about.

Accessibility IS an important issue. Sydney 2000 Olympics were successfully sued over the official Sydney Games site being inaccessible to users with disabilities. (http://www.tomw.net.au/2001/bat2001.html)

Using CSS for layout does make the site more accessible and easier (and cheaper) to maintain. The fact is that the standards (CSS1) have been around since 1996/97, but not yet adopted by most portals, not yet completely supported by all browsers. Hence a growing push from some quarters towards abondoning the use of tables for layout.

Having said that, if you know what you are doing, tables need not be that bad. For example read the interview of Peter-Paul Koch (http://netdiver.net/interviews/peterpaulkoch.php) where he presents counter-arguments to some of the w3 specs.

I've heard people sneer at them all as 'not professional'.
As long as people are aware of "issues" relating to using these components, its fine. More often than not, people aren't aware. I have seen a number of people using (for example) flash for navigation links simply to do button rollovers. If you do that, at least provide alternate navigation for people who may not have flash, or choose to disable animation during browsing.

they would never publish a book or magazine.
The print medium is different from web. If you have a book printed in glossy paper, ALL books will be in glossy, with same font, same layout. Two books will look EXACTLY the same, in US or England, Amazon valley or Australia. Not so with net.

If you want to make a book available to a person with disability, say a blind man, you have no choice. You need to get a book in braille. Not so with the net. Same page can possibly be "seen" by a blind person with braille browsers or screen readers (like Jaws).

The best websites have links all over the place, look a complete mess, but draw you in, help you navigate to where you want to go, and distract you with some really cool content on the way.
Lets say I go to a website knowing that info I am looking for is available there. If I am not able to find it, I am less likely to visit it again. In the end, cool content doesn't help beyond a certain point - easy of navigation, ability to browse the site well, pleasing (an not distracting) layout and most importantly the content is what makes site successful.

Look at the source code of amazon. It is a complete mess. Now, if they are able to deliver exact same site, but without the 5 levels of nested tables that they currently use, wouldn't that be an improvement.

Some nice sites that I'd like to refer you to:
http://devedge.netscape.com/
http://www.alistapart.com
http://www.cingular.com (of course there is a little clutter here, but lot less than their original site)
These sites does not use tables. Is it any worse visually than any of the other sites? Now look at the source. Compare it to the source of a table-based layout. Any day their source is more readable.
bloke
05-14-2003, 03:36 AM
Originally posted by bloke
They're a pain in the butt and often look rubbish. To be honest, I've managed to use them pretty much without problems but they aint my weapon of choice.

Sorry I ever got into this discussion (can't even remember why I did).

As long as we all have a choice, then I'm happy.