HTML Forum

**jason182** · 07-02-2005, 05:19 PM

Okay I added a cutenews PHP code into content box and let the caps just explain everything:

BEFORE:

AFTER:

please help I've never had a problem like this in Microsoft frontpage and dreamweavers better. so can someone please tell me whats wrong here. someone else told me that the images were supposed to be clipped but i can't CLIP them in dreamweaver because i don't know how and I can't merge them together in photoshop otherwise i wont be able to add content.

**The_Anomaly** · 07-03-2005, 05:13 AM

Do you know any CSS? if so you could edit the CSS file that probably already exhists to give the images an absolute position, then no matter what happens on the page even if something were to be overlapping it, it would still be in the same place. When your friend told you they were supposed to be clipped this was also in the CSS file. Before you try absolute positioning try to google CSS clipping and see if you can figure out how to clip them. I would tell you but i barely learned CSS and dont know clipping yet, and i do all my coding in notepad so i dont know how to use frontpage or dreamweaver sry

If you link the site or post the source i'll take a look at it and see what i can do

**onlyplace4** · 07-03-2005, 05:56 AM

Ok, this was an easy one to sort. You are missing a table in your code.

Rather than copy out the whole page source here, I've just put the snippets you need to add.

Line 26: At the moment you have

Quote:

This should be:

Quote:

Line 50: You have

Quote:

</td>
 </p>

Should be:

Quote:

</td>
</tr></table>
 </p>

I've tested in both IE and Firefox and all seems aok

Few comments I would make:

<font> tags have been deprecated - use CSS
there is no CSS file - put all your inline styles into a CSS and use classes
you have no <!DOCTYPE in your header - try <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
no meta description or keywords
get rid of the huge amounts of whitespace and lowercase your tags

Finally, at the bottom of the page you have:

Quote:

This is nonsensical and could be reduced to a single <td> element as:

Quote:

Hope all that makes sense and works for you. Cool looking site btw

**jason182** · 07-03-2005, 08:01 AM

**** I put in line26 (what you told me to) and it still looked the same when I previewed. and also I don't see a 'powered by cutenews' in line 50. so can someone please just help me out here. and ALL help will be appreciated. especially you for telling me..so yeah please.

MSN: blink_info@hotmail.com
AIM: jasoncarlson182

I do suck at HTML.

**onlyplace4** · 07-03-2005, 08:57 AM

I'll grab the code this afternoon and play with it for you. It worked for me when I did it last time in both Firefox and IE. I'll revise the bits and bobs in the page and then let you have it.

**jason182** · 07-03-2005, 09:35 AM

Thanks.

**jason182** · 07-03-2005, 10:13 AM

Also I was wondering how would it be possible for me to make all my links from my navigation go into the content box?
like this site: (as an example) http://fan.karmic-curse.net/iframes/

**onlyplace4** · 07-03-2005, 10:17 AM

Well I grabbed the whole page, did what I suggested, and hey presto - it worked.

I've had a look throuhg the page and tidied up the code a bit. Just copy and paste the entire page from below and you'll find it works.

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>:Blink 182 Fan Site:</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0">
<!-- ImageReady Slices (new layout.psd) -->
<table width=1024 border=0 cellpadding=0 cellspacing=0>
	<tr>
		<td colspan=7><img src="images/fansite2_01.png" width=1024 height=211 alt=""></td>
	</tr>
	<tr>
		<td colspan=2 rowspan=2><img src="images/fansite2_02.png" width=93 height=48 alt=""></td>
		<td colspan=3><img src="images/fansite2_03.png" width=430 height=18 alt=""></td>
		<td colspan=2><img src="images/fansite2_04.png" width=501 height=18 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_05.png" width=139 height=30 alt=""></td>
		<td colspan=2 rowspan=6 background="images/fansite2_06.png"><p>
			<table border=0>
				<tr>
				   <td width="100%" style="font-family:tahoma; text-align:justify"><b>Test</b></td>
				</tr>
				<tr>
					<td width="100%" style="text-align:justify; font-family:tahoma; color:#666; font-size:12;">It seems to only work in the comments section  <img style="border: none;" alt="wassat" src="cutenews/data/emoticons/wassat.gif"></td>
				</tr>
				<tr>
					<td width="100%">
						<table border="0" style="border-top: 1px dotted #f2f3f3" width="408" cellspacing="0">
							<tr>
								<td width="220"><i><font style="font-size: 11; color: black" face="Tahoma">28 Jun 2005 by <a href="mailto:blink_info@hotmail.com">jason182</a></font></i><br> </td>
								<td width="168" ><div align=right style="font-size: 11" face="Tahoma"><!-- no full story-->
								<a href="/fansite2.php?subaction=showcomments&amp;id=1119979042&amp;archive=&amp;start_from=&amp;ucat=1&amp;">comments (1)</a><br> 
								</td>
							</tr>
						</table>
					</td>
				</tr>
			</table>
			<!-- News Powered by CuteNews: http://cutephp.com/ -->
		</td>
		<td rowspan=7><img src="images/fansite2_07.png" width=298 height=539 alt=""></td>
	</tr>
	<tr>
		<td rowspan=6><img src="images/fansite2_08.png" width=39 height=509 alt=""></td>
		<td colspan=2><img src="images/fansite2_09.png" width=165 height=135 alt=""></td>
		<td rowspan=6><img src="images/fansite2_10.png" width=28 height=509 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_11.png" width=165 height=43 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_12.png" width=165 height=85 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_13.png" width=165 height=43 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_14.png" width=165 height=137 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_15.png" width=165 height=66 alt=""></td>
		<td colspan=2><img src="images/fansite2_16.png" width=494 height=66 alt=""></td>
	</tr>
	<tr>
		<td><img src="images/spacer.gif" width=39 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=54 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=111 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=28 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=291 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=203 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=298 height=1 alt=""></td>
	</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>

I've taken out the deprecated <font> tags and put the styles associated with them in the relevant <td> tags. I've also taken out the extraneous <div> tag you had for alignment as this is again probably best done in the <td> element. You should give some consideration to the use of a CSS file, but it works as it stands.

If you need anything explaining - give me a shout.

**onlyplace4** · 07-03-2005, 10:20 AM

Quote:

Originally Posted by jason182

Also I was wondering how would it be possible for me to make all my links from my navigation go into the content box?
like this site: (as an example) http://fan.karmic-curse.net/iframes/

You would need to convert the page to using frames or utlilise an iframe. As you are still learning HTML it is probably best if you use single pages at the moment - after all, when the images have been cached pages will load very quickly anyway.

If you are set on having a frames or iframe layout you will need to give considerable thought to the layout of your page as, at the moment, you have an overly complex table that would not be readibly convertable to frames.

**jason182** · 07-03-2005, 10:54 AM

ok thanks so much dude it worked.

2 more things i need to get sorted tho:

1)http://www.blink-revolution.net/fansite2.php (the news has to me moved up)
2)I want to change the font to a different color and size (and have it like that permantly)

**onlyplace4** · 07-03-2005, 11:28 AM

Glad to help jason.

I've altered the bits you need in the following:

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>:Blink 182 Fan Site:</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<style>
.text { text-align:justify; font-family:tahoma; color:#FF0000; font-size:12; }
.large { font-size: 16; }
.small { font-size: 11; }
</style>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0">
<!-- ImageReady Slices (new layout.psd) -->
<table width=1024 border=0 cellpadding=0 cellspacing=0>
	<tr>
		<td colspan=7><img src="images/fansite2_01.png" width=1024 height=211 alt=""></td>
	</tr>
	<tr>
		<td colspan=2 rowspan=2><img src="images/fansite2_02.png" width=93 height=48 alt=""></td>
		<td colspan=3><img src="images/fansite2_03.png" width=430 height=18 alt=""></td>
		<td colspan=2><img src="images/fansite2_04.png" width=501 height=18 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_05.png" width=139 height=30 alt=""></td>
		<td colspan=2 rowspan=6 background="images/fansite2_06.png" valign=top><p>
			<table border=0>
				<tr>
				   <td width="100%" class="text"><b class="large">Test</b></td>
				</tr>
				<tr>
					<td width="100%" class="text">It seems to only work in the comments section  <img style="border: none;" alt="wassat" src="cutenews/data/emoticons/wassat.gif"></td>
				</tr>
				<tr>
					<td width="100%">
						<table border="0" style="border-top: 1px dotted #f2f3f3" width="408" cellspacing="0">
							<tr>
								<td width="220" class="text"><i class="small">28 Jun 2005 by <a href="mailto:blink_info@hotmail.com">jason182</a></i><br> </td>
								<td width="168" ><div align=right class="text"><!-- no full story-->
								<a href="/fansite2.php?subaction=showcomments&amp;id=1119979042&amp;  archive=&amp;start_from=&amp;ucat=1&amp;">comments (1)</a><br> 
								</td>
							</tr>
						</table>
					</td>
				</tr>
			</table>
			<!-- News Powered by CuteNews: http://cutephp.com/ -->
		</td>
		<td rowspan=7><img src="images/fansite2_07.png" width=298 height=539 alt=""></td>
	</tr>
	<tr>
		<td rowspan=6><img src="images/fansite2_08.png" width=39 height=509 alt=""></td>
		<td colspan=2><img src="images/fansite2_09.png" width=165 height=135 alt=""></td>
		<td rowspan=6><img src="images/fansite2_10.png" width=28 height=509 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_11.png" width=165 height=43 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_12.png" width=165 height=85 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_13.png" width=165 height=43 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_14.png" width=165 height=137 alt=""></td>
	</tr>
	<tr>
		<td colspan=2><img src="images/fansite2_15.png" width=165 height=66 alt=""></td>
		<td colspan=2><img src="images/fansite2_16.png" width=494 height=66 alt=""></td>
	</tr>
	<tr>
		<td><img src="images/spacer.gif" width=39 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=54 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=111 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=28 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=291 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=203 height=1 alt=""></td>
		<td><img src="images/spacer.gif" width=298 height=1 alt=""></td>
	</tr>
</table>
<!-- End ImageReady Slices -->
</body>
</html>

At the top of the page now you'll find a <style></style> tagset. Within that you will find three classes - text, large and small. The colour of the text is controlled by the #XXXXXX number (in hex so #FFFFFF = white and #000000 = black). I've set it to red so you can immediately see the result. In the code you will now find that I have replaced style="" attributes with class="", these classes relating to the style classes. I hope that's clear.

Hope that sorts things out for you.

**jason182** · 07-03-2005, 12:33 PM

Yes thanks alot AGAIN.
but only problem (lol) when I add more news (on cutenews) it doesn't show on my layout.
and I guess I'll just have to learn Iframes in sometime..and actually learn to install web statistics properly because it's something to do with Mysqual

**onlyplace4** · 07-03-2005, 01:00 PM

It can be a steep learning curve that's for sure at times. Even now, after ... well lets leave the number of years out ... I'm still learning new things every day.

Never used cutenews so I can't comment on what is happening there, but there's probably some useful stuff for you on their site.

Glad I have been able to help you jason - keep it up

HTML Forum

Find a Professional HTML Freelancer!

FREE Outsourcing eBook!