...

View Full Version : can't seem to line up these two images



canadianjameson
12-09-2005, 02:57 AM
hey.

checkout the two fading HR's i have. where they meet in the top lefthand corner i cant seem to remove that one little whitespace.

www.enviromark.ca/jay/Bridget/index.htm

any ideas?



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Education 101</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="main.css" type="text/css" media="screen">
</head>

<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="60" width="79" colspan="2" rowspan="2">&nbsp;</td>
<td height="30">&nbsp;</td>
</tr>
<tr>
<td height="1"><img src="Images/hr.jpg"></td>
</tr>
<tr>
<td width="80" valign="top"><p><br>
<a href="reading1.htm">Summary 1</a><br>
<a href="reading2.htm">Summary 2</a><br>
<a href="reading3.htm">Summary 3</a><br>
<br>
<a href="suggestedReadings.htm">Suggested Readings</a><br>
<br>
<a href="contact.htm">Contact</a></p>
</td>
<td width="1" valign="top"><img src="Images/hrVert.JPG" width="1" height="600"></td>
<td valign="top">&nbsp;</td>
</tr>
<tr>
<td colspan="2" valign="top">&nbsp;</td>
<td align="center" valign="top"><p><br>
Ward Design</p>
</td>
</tr>
</table>
</body>
</html>

Dolphin123
12-09-2005, 05:44 AM
Try this:

Added two table id's to the css and then ran a negative margin. It looks like everything lines up.
Don't know how it runs cross-browsers, but it should run fine(?) You will have to check it across
different browsers.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Education 101</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" href="main.css" type="text/css" media="screen">
</head>

<body>
<table width="100%" height="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="60" width="80" colspan="2" rowspan="2">&nbsp;</td>
<td height="30">&nbsp;</td>
</tr>
<tr>
<td id="horizontal" height="1" border="0" cellpadding="0" cellspacing="0"></td>
</tr>
<tr>
<td width="80" valign="top"><p><br>
<a href="reading1.htm">Summary 1</a><br>
<a href="reading2.htm">Summary 2</a><br>
<a href="reading3.htm">Summary 3</a><br>
<br>
<a href="suggestedReadings.htm">Suggested Readings</a><br>
<br>
<a href="contact.htm">Contact</a></p>
</td>
<td id="vertical" width="1"></td>
<td>&nbsp;</td>
</tr>
<tr>
<td colspan="2" valign="top">&nbsp;</td>
<td align="left" valign="top"><p><br>
Ward Design</p>
</td>
</tr>
</table>
</body>
</html>



/*
a:link, a:active, a:visited {
color: #949191;
font-size : 12;
Font-Family: Arial;
text-decoration: none}
*/

a:link, a:active, a:visited {
color: #000000;
font-size : 12;
font-family: arial, sans-serif;
text-decoration: none}

a:hover {
color: #000000;
font-size : 12;
font-family: arial, sans-serif;
text-decoration: underline}

BODY {
scrollbar-arrow-color:#000000;
scrollbar-track-color:#FFFFFF;
scrollbar-shadow-color:#000000;
scrollbar-face-color:#FFFFFF;
scrollbar-highlight-color:#000000;
scrollbar-darkshadow-color:#FFFFFF;
scrollbar-3dlight-color:#FFFFFF}

FONT
{
color: #000000;
font-family: arial, sans-serif;}

#horizontal{
background-image: url("Images/hr.jpg");
background-repeat:no-repeat;
background-position: -2px 1px}

#vertical{
background-image: url("Images/hrVert.JPG");
background-repeat:no-repeat;
background-position: 0px -2px}

canadianjameson
12-09-2005, 05:20 PM
thanks :P

Dolphin123
12-10-2005, 05:47 PM
You're welcome

The site is looking very nice so far.

Love the subtle fades, it is a really nice touch.

:thumbsup:



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum