PDA

Click to See Complete Forum and Search --> : White space around image links

Lyss
10-08-2006, 06:22 AM
I've recently been trying to use AJAXtabs to use links to send content to a div layer which I managed to get to work by putting the tabs into a table. I'm using image links and usually I put each image in it's own column in the table, however if I do that now the links don't work, they open in the whole window rather than the div.

So my problem is, I put all the images next to each other rather than in their own columns and there's white space around them and it won't leave. Anyone have any advice? :)
Kor
10-08-2006, 06:32 AM
can you detail a little bit, please? Seems confusing, for me, at least...
Lyss
10-08-2006, 06:39 AM
basically i'm using a table to line up my header image and image links. Usually i put the links in their seperate columns, however I can't do that at the moment otherwise the links don't work how i'd like them to. So the image links have white space around them because they don't want to line up together. I was wondering if there's way to solve that??
Kor
10-08-2006, 06:41 AM
can we see the code?
Lyss
10-08-2006, 06:57 AM
yup :) this file is just called demo.htm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="ajaxtabs/ajaxtabs.css" />
<script type="text/javascript" src="ajaxtabs/ajaxtabs.js">

/***********************************************
* Ajax Tabs Content script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
<style type="text/css">
<!--
a:link {
text-decoration: underline;
color: #FFFFFF;
}
a:visited {
text-decoration: underline;
color: #CCCCCC;
}
a:hover {
text-decoration: none;
color: #CCCCCC;
}
a:active {
text-decoration: underline;
color: #CCCCCC;
}
body {
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
</head>
<body>
<div align="left">
<table width="682" border="0" align="left" leftmargin="0" left="0" top="0" topmargin="0" cellpadding="0" cellspacing="0">


<tr>
<td colspan="2"><img src="IMG/EPpopup_r1_c1.jpg" padding="0px" width="600" height="123"></td>
</tr>
<tr>
<td colspan="2"><a href="#default"></a></a></td>
</tr>

<tr>
<td width="682" height="25" align="left" valign="top"><ul id="maintab" class="shadetabs">
<li><a href="home.php" rel="ajaxcontentarea"><img src="IMG/EPpopup_r2_c1.jpg" width="110" height="25" border="0"></a></li>
<li><a href="band.php" rel="ajaxcontentarea"><img src="IMG/EPpopup_r2_c2.jpg" width="38" height="25" border="0"></a></li>
<li><a href="media.php" rel="ajaxcontentarea"><img src="IMG/EPpopup_r2_c3.jpg" padding="0" width="43" height="25" border="0"></a></li>
<li><a href="gigs.php" rel="ajaxcontentarea"><img src="IMG/EPpopup_r2_c4.jpg" width="36" align:"left" height="25" border="0"></a></li>
<li><a href="merch.php" rel="ajaxcontentarea"><img src="IMG/EPpopup_r2_c5.jpg" width="42" height="25" border="0"></a></li>
<li><a href="contact.php" rel="ajaxcontentarea"><img src="IMG/EPpopup_r2_c6.jpg" width="53" height="25" border="0"></a></li>
<li><a href="http://www.myspace.com/gothamcityheartattack" rel="ajaxcontentarea"><img src="IMG/EPpopup_r2_c7.jpg" width="278" height="25" border="0"></a></li></ul></td>


</tr>
<tr>
<td colspan="2"><img src="IMG/EPpopup_r3_c1.jpg">
<div class="contentstyle" id="ajaxcontentarea" style="position:absolute; width:480px; height:341px; z-index:1; left: 49px; top: 184px;"></div>

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



<script type="text/javascript">
//Start Ajax tabs script for UL with id="maintab" Separate multiple ids each with a comma.
startajaxtabs("maintab")
</script>
</body>
</html>
Lyss
10-08-2006, 07:21 AM
ok, I fixed one problem. now this is my problem http://gothamcityheartattack.com/demo.php

Edit: Actually the links don't work how i'd like them too. It's giving me such a headache.