By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
438,879 Members | 1,859 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 438,879 IT Pros & Developers. It's quick & easy.

Positioning relative v absolute-- Style or functionality, not both

P: n/a
GGG
Neither go the way I want them to... Absolute doesn't get it right
over multiple browsers. Relative puts it in the right place, but only
the portion that it is "relative" the style, #wleMenu, is running.
Holding the cursor over any portion OUTSIDE of this block is not
registering.
Mozilla doesn't do anything, IE will fire off an error, when I go past
"the zone" with "object required" (like the scipting isn't even there)

I have the following CSS code.

#wleMenu

{
position: absolute;
left: 1;
width: 245px;
height: 786px;
}

#twoLine {position:absolute;bottom:-325;left:-5;width:850;height:40;}
/* ( I've also tried, {position: relative;bottom-770;left;-85;width:
850;height:40;}
(also have had "px" at the back of the width and height) */
--- filebloc1

<script language="javascript" src="js/t.js"></script>
<!---side menu covers the dividing bar and the side menu--->
<div id="oneLine" class="bi24" &nbsp;</div<!---dividing bar--->
<div id="wleMenu" class="bi52" align='center' <!---side menu--->

<div align='center'><div class="bi40">Services</div></div>
<br>
<!--colors the menu section-->
<a href="index.php" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j1','','images/r180hom.gif',1)"><img name="j1"
alt="8" border="0" src="images/b180hom.gif" ></a>
<a href="intro.php" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j2','','images/r180care.gif',1)"><img name="j2"
alt="8" border="0" src="images/b180care.gif" ></a>
<a href="compSvc.php" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j3','','images/r180cs.gif',1)"><img name="j3"
alt="8" border="0" src="images/b180cs.gif" ></a>
<a href="Skills.htm" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j4','','images/r180pgm.gif',1)"><img name="j4"
alt="8" border="0" src="images/b180pgm.gif"></a>
<a href="weblinks.php" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j5','','images/r180ws.gif',1)"><img name="j5"
alt="8" border="0" src="images/b180ws.gif" </a>
<a href="vertgen.php" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j8','','images/r180fs.gif',1)"><img name="j8"
alt="8" border="0" src="images/b180fs.gif" </a>

<a href="ebyaTA.php" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j6','','images/r180ta.gif',1)"><img name="j6"
alt="8" border="0" src="images/b180ta.gif" </a>
<a href="#" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j7','','images/r180msg.gif',1)"><img name="j7"
alt="8" border="0" src="images/b180msg.gif" </a>
<br><br>
<div class="bi40" align='center'>On the Lighter Side</div>
<br><br>
<a href="#" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j9','','images/r180int.gif',1)"><img name="j9"
alt="8" border="0" src="images/b180int.gif" </a>
<a href="#" title="coming Soon" onMouseOut="swapImgRest()"
onMouseOver="swapImg('j10','','images/r180trav.gif',1)"><img
name="j10" alt="8" border="0" src="images/b180trav.gif" </a>
<!---expand this one to cover the first I-40, my trip to PA/west
coast/experiences in PA. Make it entertaining, wahoo.--->
<a href="swtoc.html" title="Yes, these were my experiences"
onMouseOut="swapImgRest()" onMouseOver="swapImg('j11','','images/
r180AM.gif',1)"><img name="j11" alt="8" border="0" src="images/
b180AM.gif" </a>

</div><!--closes wlemenu-->

----Fileblock2--- this follows the above... it's the bottom menu I
want to have functionality with when doing a relative position, and
which very little of it works in its current stead.
<div id="twoLine" class="bi47">
<table width="775" " border="0" cellspacing="0" cellpadding="0" >
<tr>
<td width="55" ><a href="index.php"
onMouseOut="swapImgRest()" onMouseOver="swapImg('I1','','images/
bk90hom.gif',1)"><img name="I1" alt="8" border="0" src="images/
r90hom.gif" ></a></td>
<td><a href="intro.php" onMouseOut="swapImgRest()"
onMouseOver="swapImg('I2','','images/bk90care.gif',1)"><img name="I2"
border="0" src="images/r90care.gif" ></a></td>
<td width="87"><a href="Skills.html"
onMouseOut="swapImgRest()" onMouseOver="swapImg('I4','','images/
bk90pgm.gif',1)"><img name="I4" border="0" src="images/r90pgm.gif" ></
a></td>
<td ><a href="portfolio.htm" onMouseOut="swapImgRest()"
onMouseOver="swapImg('I8','','images/bk90ebya.gif',1)"><img
src="images/r90ebya.gif" name="I8" border="0"></a></td>
<td ><a href="http://www.responsemarketing.com/"
onMouseOut="swapImgRest()" onMouseOver="swapImg('I5','','images/
bk90msg.gif',1)" target="_blank"><img name="I5" border="0" src="images/
r90msg.gif" ></a></td>
<td ><a href="http://rjlauren.com/rjlauren/index.html"
onMouseOut="swapImgRest()" onMouseOver="swapImg('I6','','images/
bk90fs.gif',1)" target="_blank"><img name="I6" border="0" src="images/
r90fs.gif"></a></td>
<td width="87"><a href="compSrv.php"
onMouseOut="swapImgRest()" onMouseOver="swapImg('I3','','images/
bk90cs.gif',1)"><img name="I3" border="0" src="images/r90cs.gif" ></
a></td>
<td ><a href="contact.htm" onMouseOut="swapImgRest()"
onMouseOver="swapImg('I7','','images/bk90trav.gif',1)"><img name="I7"
border="0" src="images/r90trav.gif" width="50" height="28"></a></td>
</tr>
<tr>
<td align='center' class="smallpr" colspan="8">FAQ | <a
href="mailto:da***@steric.net"Contact Me</a</td>

<td></td>

</tr>
</table>
</div>
all in the form of php includes (again, it does not matter if I hard
code it into a file or use server includes ala php--- same result.)
When I use "relative" (the second option), I get what I want. Just
nothing outside of the wleMenu works.
When I use "absolute", the design really sucks, but I get
functionality.
I know it is better to use relative, but how do I get the other damned
options to work the way they are supposed to?

I'm too embarassed to show my site.

Mar 10 '07 #1
Share this Question
Share on Google+
1 Reply


P: n/a
GG*@steric.net wrote:
>
I have the following CSS code.
Don't post code, post a URL.
I'm too embarassed to show my site.
Maybe so, but we still need to see it if you expect to get some help
with it.

BTW, the first thing you should do is validate your code. This will
eliminate syntax errors as a cause of rendering problems. Your code
definitely has errors in it.
http://validator.w3.org/
http://jigsaw.w3.org/css-validator/

--
Berg
Mar 10 '07 #2

This discussion thread is closed

Replies have been disabled for this discussion.