Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

<TABLE> nightmare 1

Status
Not open for further replies.

ADoozer

Programmer
Dec 15, 2002
3,487
AU
im having a table nightmare:-

im hoping its something really obvious that im overlooking, but my heads spinning.

House.jpg = 110px*110px
HeaderBackground = 5px*110px

there should be 1 row and 2 columns (row=110 col=110,"100%")
the problem is that the picture(house.jpg) has a white line under (at a guess 10 or so pixels*110 pixels)

Code:
<!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.01 Frameset//EN&quot; &quot;[URL unfurl="true"]http://www.w3c.org/TR/1999/REC-html401-19991224/frameset.dtd&quot;>[/URL]
<!-- -->
<HTML>
<HEAD>
<TITLE>
Haunted Hive Records
</TITLE>
<META http-equiv=Content-Type content=&quot;text/html; charset=iso-8859-1&quot;>
<META content=&quot;MSHTML 6.00.2800.1170&quot; name=GENERATOR>
</HEAD>

<BODY>	
<TABLE cellSpacing=0 cellPadding=0 height=110 width=&quot;100%&quot; border=0>
<TBODY>
<TR height=110>
<TD>
<DIV align=left>		
<IMG height=&quot;100%&quot; width=&quot;100%&quot; SRC=&quot;House.jpg&quot;>
</DIV>
</TD>
<TD background=&quot;HeaderBackground.jpg&quot; height=&quot;100%&quot; width=&quot;100%&quot; nowrap=true>
<DIV align=center>
<P align=Center>
<!-- blood.ttf -->
<FONT Face=Blood size=&quot;+6&quot; color=red> 
Haunted Hive Records
</FONT>
</P>
</DIV>
</TD>
</TR>
</TBODY>
</TABLE>
</BODY>
</HTML>

can anybody help me out?
(as you may tell im new to &quot;proper&quot; html)

thanx in advance!

If somethings hard to do, its not worth doing - Homer Simpson
------------------------------------------------------------------------
A General Guide To Excel in VB FAQ222-3383
File Formats Galore @
 
The height of the right cell is effected by the font size attribute and could cause the space you are seeing

Code:
<FONT Face=Blood size=&quot;+6&quot; color=red>

-pete
 
this works for me, added quote marks here and there, removed the extra elements, changed the doctype your declaration was for a frameset document. It was easier than trying to explain, compare the two for the differences.
You may want to look up the WEFT Font embedding tool from M$ to use your 'Blood' font on the page

<!DOCTYPE HTML PUBLIC &quot;-//W3C//DTD HTML 4.01 Transitional//EN&quot; &quot;<HTML>
<HEAD>
<TITLE>Haunted Hive Records</TITLE>
<META http-equiv=&quot;Content-Type&quot; content=&quot;text/html; charset=iso-8859-1&quot;>
<META content=&quot;MSHTML 6.00.2800.1170&quot; name=&quot;GENERATOR&quot;>
</HEAD>
<BODY bgcolor=&quot;#CCFFFF&quot;>
<TABLE cellSpacing=0 cellPadding=0 width=&quot;100%&quot; border=0>
<TBODY>
<TR>
<TD align=&quot;left&quot;><IMG height=&quot;110&quot; width=&quot;110&quot; SRC=&quot;House.jpg&quot; alt=&quot;house.jpg&quot;></TD>
<TD background=&quot;HeaderBackground.jpg&quot; width=&quot;100%&quot; nowrap>
<P align=&quot;center&quot;><!-- blood.ttf --><FONT Face=&quot;Blood&quot; size=&quot;+6&quot; color=&quot;red&quot;>Haunted Hive Records</FONT></P>
</TD>
</TR>
</TBODY>
</TABLE>
</BODY>
</HTML>

Chris.



Indifference will be the downfall of mankind, but who cares?
 
palbano: i tried removing the text altogether... same problem

ChrisHirst: i cut and pasted your code, same thing happened.

on a hunch i made a new picture (just in case the image was reporting the wrong size), again no luck.

i then increased the image size to 120*120 and the other cell resized to leave an overlap again!!

ive also noticed the header background is tiling vertically as well as horizontally even when i set the height to &quot;110&quot; (again with and without the text!!).

is there an alternate to frames and tables that is easyer to position items!!

i will have a look at that weft sight, as soon as i get this blasted thing sorted.

thanks both for your input!

If somethings hard to do, its not worth doing - Homer Simpson
------------------------------------------------------------------------
A General Guide To Excel in VB FAQ222-3383
File Formats Galore @
 
The alternative is to use nested <div>s and CSS for positioning and you can get much better results than using tables especially for cross-browser compatibility. It takes a bit more thought and care than throwing tables on a page and you'll have to live with the fact that maybe it won't look right in NS4 and IE3, but hey, < 3% of internet users can't all be right!
I'm just in the middle of building a site that is using a tab style navigation bar without tables, javascript or images and everything is set in the style sheet and it looks precisely the same in NS6, NS7, Opera, IE5 and IE6.
The net reult of this is the pages load much quicker and once the layout is set I can spend more time on getting the content right rather than playing with javascript workarounds.

Take a look at w3schools CSS tutorial
Chris.


Indifference will be the downfall of mankind, but who cares?
 
thanks, im looking into CSS now.

If somethings hard to do, its not worth doing - Homer Simpson
------------------------------------------------------------------------
A General Guide To Excel in VB FAQ222-3383
File Formats Galore @
 
hmmm, i modded my code to use css but,
1) i think i went overkill with my CSS (ive not figured out how to use inheritance properly)
2) i can no longer use frmaes.

(DIV1a to 2b specify x and y coords and height and width)

the code:-
<DIV class=&quot;DIV1a&quot;>
<IMG src=&quot;HauntedHiveRecords_Data/House.jpg&quot; alt=&quot;House.jpg&quot;>
</DIV>
<DIV class=&quot;DIV1b&quot;>
<DIV class=&quot;HeaderText&quot; nowrap>
Haunted Hive Records
</DIV>
</DIV>
<DIV class=&quot;DIV2a&quot;>
<A class=&quot;Menu&quot; target=&quot;MainArea&quot; href=&quot;HauntedHiveRecords_Data/Home.htm&quot;>
Home
</A>
</DIV>
<DIV class=&quot;DIV2b&quot;>
<FRAMESET rows=&quot;*&quot; cols=&quot;*&quot; border=&quot;0&quot; framespacing=&quot;0&quot; frameborder=&quot;no&quot;>
<FRAME name=&quot;MainArea&quot; src=&quot;HauntedHiveRecords_Data/Home.htm&quot;>
</FRAMESET>
</DIV>

1) can i set up the css so that all text (except that in the frame) uses font-family:Blood color:red text-align:center
and then the different divisions inherit this but choose there own vertical alignment and font size
2) is it possible to have a frame in a division??

thanx for your time and patience!

If somethings hard to do, its not worth doing - Homer Simpson
------------------------------------------------------------------------
A General Guide To Excel in VB FAQ222-3383
File Formats Galore @
 
Specify your image in pixels, not percentages: <IMG height=&quot;110&quot; width=&quot;110&quot; SRC=&quot;House.jpg&quot;>

There's always a better way...
 
tviman: yeah i tried that.. no luck, and now ive given up on tables all together... thanks anyway

If somethings hard to do, its not worth doing - Homer Simpson
------------------------------------------------------------------------
A General Guide To Excel in VB FAQ222-3383
File Formats Galore @
 
I think you are getting confused between FRAMEs and IFRAMEs.

A frameset (Frames)is the complete set of pages within the browser, I guess what you are looking to use is an inline frame <iframe>, an area within the page that can be given it's own HTML source from an external file.
And yes you can use a <iframe> within a <div>.
CSS positioning and inheritance is confusing when you first start to use it correctly, but it really is worth persevering with and just use tables for what they were designed for.

Chris.


Indifference will be the downfall of mankind, but who cares?
 
that makes sense (id never heared of, let alone used an iframe before [all my reading has been from saving web sites with a similar layout to what im after and reading there code])

i think ive sorted the inheritance (of color,font etc) by setting these value in the Body{} bit, whether that is the &quot;correct&quot; way im still not sure, however time will tell!

q) ive been doing something like:-

.Menu{size:300%}
.Menu:link {text-decoration: none}
.Menu:visited {text-decoration: none}
.Menu:hover {font-size: 350%}

<A class=&quot;Menu&quot; href:&quot;whatever&quot;> Home Page </A>

is it possible to put all this info into one &quot;style&quot;... (this i tried and it didnt work)

.Menu{size:300%;
link:text-decoration: none;
visited:text-decoration: non;
hover:font-size: 350%}

i think im picking this up now, its just a matter of learning all the syntax and what applies where!!!

and heres a star for the ongoing help and info

thnx!

If somethings hard to do, its not worth doing - Homer Simpson
------------------------------------------------------------------------
A General Guide To Excel in VB FAQ222-3383
File Formats Galore @
 
the best way of setting styles is in an external style sheet, that way you can have several (or just one) sheets that apply styles to your pages and the include them with a relative link in the document head eg;
<LINK rel=&quot;stylesheet&quot; href=&quot;/include/style.css&quot; type=&quot;text/css&quot;> and it means less 'bloat' in your pages,

You can't (as yet) define styles that way each one needs a seperate entry like so;
this define a class that will only apply to anchors <A>
a.menu:link {color: #0000FF; font-size:300%}
a.menu:hover {color: #FF0000; font-size:350%}

.menu {font-size: 2ems; color: #CCFFCC; background-color:#FF0000)
this will define a font size for ANY element that is twice the size of the default in a pastel green on red ( very nice, NOT)

Have a read at the tutorials on and w3schools and it will become clear.


Chris.


Indifference will be the downfall of mankind, but who cares?
 
<DIV>'s and CSS... my 2 new favourite words... the tutorials at elated.com are excelent, the W3schools one has a lot of syntax but didnt really help add to my knowledge base

as soon as the site is up and running ill post a link, then everyone can see the fruits of my labour!!!

ChrisHirst thanks again, your a star!!

If somethings hard to do, its not worth doing - Homer Simpson
------------------------------------------------------------------------
A General Guide To Excel in VB FAQ222-3383
File Formats Galore @
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top