Solved

Table sizing

Posted on 1998-11-23
9
137 Views
Last Modified: 2010-04-09
I want to know exactly how the netbrowser determines the width and height of cells in a table. I know it depends on the contents of a cell and i know too that WIDTH= and HEIGHT= in a <TD> tag are in most cases simply ignored. I want to use tables to position blocks of text and images on an exact location. A browsers own interpretation of WIDTH= and HEIGHT= messes up my layout really bad.
0
Comment
Question by:joostjag
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
9 Comments
 
LVL 4

Expert Comment

by:martinag
ID: 1839998
You can use CSS which will place the things *exactly* where you want them:

Inside <HEAD></HEAD>:
<STYLE>
<!--
#myDiv {
  position: absolute;
  top: 100;
  left: 10;
}
// -->
</STYLE>

Somewhere in document:
<DIV ID="myDiv">Content</DIV>

If you use position: relative, the content will be placed 100 pixels under the last component added (the position is relative). If you use absolute it'll be absolute ie from top left corner of page. I don't know which of them you want.

Martin
0
 
LVL 1

Expert Comment

by:rajgn
ID: 1839999
I'm sorry, I don't agree with your views on WIDTH/HEIGHT attributes of a table/cell. perhaps, contradictory attributes may caused you feel like that(in that case browser will not behave in intended way). One key here is setting these attributes in '%' and 'pixels'. If you use '%' it's always going to be relative. On the otherhand setting in pixels is absolute. Hence there's always a possibility of a mixup, which may give us such impressions.

Using tables inside tables, virtually you can position text/images anywhere on the page. But it's implementable when you've any authoring tool like Frontpage(otherwise it's too labourious process to do manually). I did this successfully very recently to find how good are tables to position on a page(unfortunately I can't give you the URL since it's on Intranet)
0
 
LVL 4

Expert Comment

by:rafistern
ID: 1840000
A way of solving the problem is to define width in the <table> tag and then again in the <td> tags. This is follproof (assuming you don't contradict yourself).
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:joostjag
ID: 1840001
I must admit I was wrong about the WIDTH/HEIGHT attributes. When I explicitly specified these for most cells the browser showed the table the way I wanted. It seems like omitting these attributes in some cells also causes other non-related cells to change size. That's why it seemed my browser ignored the WIDTH/HEIGHT attributes.
I'm creating HTML files in a plain text editor. Maybe using Frontpage will fix this sizing problem automatically.
0
 
LVL 4

Expert Comment

by:rafistern
ID: 1840002
Using FrontPage sounds like a really bad idea to me. How about Allaire Homesite?
0
 
LVL 1

Expert Comment

by:rajgn
ID: 1840004
Well, as some of you said, I too don't like Frontpage which always messes up with the code. BUT if you refer to my last comment, I suggested this ONLY to avoid laborious process of laying down tables inside tables inorder to achieve perfect alignment of text/graphics. And is not a generalized solution.

Since 'martike' said plain text editor will allow you much more control over your HTML than FrontPage, I wanted to show you an example. Just refer to 'www.wipro.com'. Initially you don't feel something great with that page. But you try to do the same thing(i.e aligning all the menu item gif's with the central main gif) USING only NOTEPAD as your editor. Then tell me how much time you spend on doing that(be honest!, if at all you're successful). Now try doing the same thing with any HTML authoring tool(not only FP). Now you'll find the difference and will understand what I was saying.

Finally as 'martike' himself said, it all depends on what it is you really want, and how(slowly) do you want it(if you don't mind wasting time in changing width/height attributes of each cell in notepad)
0
 
LVL 6

Expert Comment

by:PBall
ID: 1840005
Hehe, that's why I like laying out my screen in Photoshop first since I can get very precise about the layout setting.

After doing so, even using Notepad to code the layout will not be so difficult.

FrontPage and all those other 'I know what you want and uhm...your syntax is incorrect, so let me add some junk codes to make it correct and hey, where is the end tag for this paragraph, and look...no quote here, let's add quote' web editors...what can I say..they suck.

So far, I can live with Interdev, but even with it I code my table manually.
0
 
LVL 1

Accepted Solution

by:
toTo earned 70 total points
ID: 1840007
use invisible pictures with the "good" size in a cell
in each column or line you want to recize.
0
 
LVL 1

Expert Comment

by:rajgn
ID: 1840008
martike:

You're right. In most cases I found Front page annoying. Particularly, it'll not allow you embed your own code. Most of the times it replaces your code with it's own tags.
0

Featured Post

Enroll in May's Course of the Month

May’s Course of the Month is now available! Experts Exchange’s Premium Members and Team Accounts have access to a complimentary course each month as part of their membership—an extra way to increase training and boost professional development.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Is your Office 365 signature not working the way you want it to? Are signature updates taking up too much of your time? Let's run through the most common problems that an IT administrator can encounter when dealing with Office 365 email signatures.
Find out what you should include to make the best professional email signature for your organization.
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

738 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question