lately ive been working on learning css, i recently made some classes so i could put 3 types of links on one page footer area, side navigation area and header area right under my banner. On one set its with a background and border set to 147px and the padding is set to px padding-left, so the problem is this i made a graphic in fireworks to place inside a nested table and i made the graphic 147w by 55hght
but when i inserted over my CSS menu which also is supposed to be 147px it came up short, so i added borders to the nested table to see how many pixels it would take to measure correctly and it measured correctly at 154px but the menu was 147px? im not sure if the padding inside my links code is added on top of the 147px or not but even so that would come out ot 152px not 154px.
basically what im trying to do is add an image that has the same width as the menu over the top of it.
here is the link
<!-- m --><a class="postlink" href="http://www.angeltowns2.com/members/collado/index.html">http://www.angeltowns2.com/members/collado/index.html</a><!-- m -->
and i will attach the image.
<style type="text/css">
<!--
A.footer:link { text-decoration: underline; color:#ffffff }
A.sidenav:link { text-decoration:none;background-color:#b7b7b7; width:147px;
border:1px solid black; display:block; padding-left:5px }
A.header:link {text-decoration
verline underline; color:#4d7fbf }
A.footer:visited { text-decoration: underline; color:#ffffff }
A.sidenav:visited { text-decoration: none;background-color:#b7b7b7; width:147px;
border:1px solid black; display:block; padding-left:5px }
A.header:visited {text-decorationverline underline; color:#4d7fbf }
A.footer:hover { text-decoration: none; color:#ececec }
A.sidenav:hover { text-decoration: none;background-color:#c0c0c0; width:147px;
border:1px solid black; display:block; padding-left:5px }
A.header:hover {text-decoration: underline overline; color:#d5dcef }
-->
</style>
by the way the graphic matches the menu correctly in IE6 but not in firefox 0.9.2 i dont know what gives with it?
any help would be very much appreciated
but when i inserted over my CSS menu which also is supposed to be 147px it came up short, so i added borders to the nested table to see how many pixels it would take to measure correctly and it measured correctly at 154px but the menu was 147px? im not sure if the padding inside my links code is added on top of the 147px or not but even so that would come out ot 152px not 154px.
basically what im trying to do is add an image that has the same width as the menu over the top of it.
here is the link
<!-- m --><a class="postlink" href="http://www.angeltowns2.com/members/collado/index.html">http://www.angeltowns2.com/members/collado/index.html</a><!-- m -->
and i will attach the image.
<style type="text/css">
<!--
A.footer:link { text-decoration: underline; color:#ffffff }
A.sidenav:link { text-decoration:none;background-color:#b7b7b7; width:147px;
border:1px solid black; display:block; padding-left:5px }
A.header:link {text-decoration
verline underline; color:#4d7fbf }A.footer:visited { text-decoration: underline; color:#ffffff }
A.sidenav:visited { text-decoration: none;background-color:#b7b7b7; width:147px;
border:1px solid black; display:block; padding-left:5px }
A.header:visited {text-decoration
verline underline; color:#4d7fbf }A.footer:hover { text-decoration: none; color:#ececec }
A.sidenav:hover { text-decoration: none;background-color:#c0c0c0; width:147px;
border:1px solid black; display:block; padding-left:5px }
A.header:hover {text-decoration: underline overline; color:#d5dcef }
-->
</style>
by the way the graphic matches the menu correctly in IE6 but not in firefox 0.9.2 i dont know what gives with it?
any help would be very much appreciated