SitePoint Sponsor |
|
User Tag List
Results 1 to 10 of 10
-
Sep 25, 2003, 05:43 #1
- Join Date
- May 2001
- Location
- toronto
- Posts
- 478
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
i have a feeling that css has something to do with this - "hidden" links in NN4
hey
http://nicotine.golden.net/~nina/lak...ROverview.html
ok - if you open it in Netscape 4 - you can't click ANY of the links inside the main content cell... has anyone seen this? i've also posted it in Browser Issues, but i have a funny feeling its a z-index thing with css... but you'd think that if you can SEE it then you should be able to CLICK it? no?
ok
-
Sep 25, 2003, 05:45 #2
- Join Date
- Apr 2003
- Location
- Bath, UK
- Posts
- 353
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Not if you had a transparent element over the top of the links, you would be able to see through to them but the transparent element would get the clicks; I think.
-
Sep 25, 2003, 05:56 #3
- Join Date
- May 2001
- Location
- toronto
- Posts
- 478
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
ok - so this might be my problem the i guess... i have a
Code:in THE StyesNN.css #main { position:relative; margin-left:175px; top:115px; width: 512px; } in the @import Styles.css #main { position:absolute; margin-left:175px; top: 115px; z-index:1; width: 512px; padding-right: 10px; border-right: 1px dotted #999999; }
Code:<div id="main"> <span class="contnt"> <!-- this is just a font style, etc.--> stuff in here </span> </div>
-
Sep 25, 2003, 06:10 #4
- Join Date
- May 2003
- Location
- Liverpool
- Posts
- 361
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
class="contnt" ?
That's not mentioned in the above styles, so I'd guess there's something else that isn't. Post it all (the NN version).
-
Sep 25, 2003, 06:17 #5
- Join Date
- May 2001
- Location
- toronto
- Posts
- 478
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
ok
Code:/* CSS Document - MAIN SECTION - TEMPLATES */ body, div, p, th, td, li, dd { /* redundant selectors to help NS4 not forget */ font-family: Verdana, Lucida, Arial, Helvetica, sans-serif; font-size: small; } /* NAVIGATION PROPERTIES AND STYLES */ A.navtop:link, A.navtop:active, A.navtop:visited { COLOR: #000000; FONT-FAMILY: "Verdana","Arial","Helvetica","sans-serif"; FONT-WEIGHT: bold; TEXT-DECORATION: none; FONT-SIZE: 11px; } A.navtop:hover { COLOR: #990000; FONT-FAMILY: "Verdana","Arial","Helvetica","sans-serif"; FONT-WEIGHT: bold; TEXT-DECORATION: none; FONT-SIZE: 11px; } A.navstyle:link, A.navstyle:active, A.navstyle:visited { COLOR: #000000; FONT-FAMILY: "Verdana", "Arial", "Helvetica", "sans-serif"; TEXT-DECORATION: none; FONT-SIZE: 11px; MARGIN-LEFT: 10px; MARGIN-TOP: 1px; } A.navstyle:hover { COLOR: #990000; FONT-FAMILY: "Verdana","Arial","Helvetica","sans-serif"; TEXT-DECORATION: none; FONT-SIZE: 11px; MARGIN-LEFT: 10px; MARGIN-TOP: 1px; } A.navstyle1:link, A.navstyle1:active, A.navstyle1:visited { COLOR: #FFFFFF; FONT-FAMILY: "Verdana","Arial","Helvetica","sans-serif"; FONT-SIZE: 11px; FONT-WEIGHT: bold; MARGIN-LEFT: 5px; MARGIN-TOP: 1px; TEXT-DECORATION: none; } A.navstyle1:hover { COLOR: #000000; FONT-FAMILY: "Verdana","Arial","Helvetica","sans-serif"; FONT-SIZE: 11px; FONT-WEIGHT: bold; MARGIN-LEFT: 5px; MARGIN-TOP: 1px; TEXT-DECORATION: none; } A.navbot:link, A.navbot:active, A.navbot:visited { COLOR: #000000; FONT-FAMILY: "Verdana","Arial","Helvetica","sans-serif"; FONT-WEIGHT: bold; TEXT-DECORATION: none; FONT-SIZE: small; } A.navbot:hover { COLOR: #990000; FONT-FAMILY: "Verdana","Arial","Helvetica","sans-serif"; FONT-WEIGHT: bold; TEXT-DECORATION: none; FONT-SIZE: small; } /* CSS POSITIONED ELEMENTS */ #main { position:relative; margin-left:175px; top:115px; width: 512px; } #topnav { position: absolute; z-index: 2; top: 71px;} #mainnav { position:absolute; left:0px; top:93px; width:152px; z-index:2; } /* WILL NOT USE AT THIS TIME #adsside { position:absolute; left:697px; top:110px; z-index:3; padding-left: 10px; } */ #bgtable { position: absolute; height: 100%; top: 0; left: 0; border: 0; } #sidenav { position: absolute; z-index: 1; top: 0; left: 0; border: 0; } #footer { width: 500px; border: 1px solid #999999; } #copyright { padding-top: 5px; padding-bottom: 10px; } /* CONTNT ELEMENTS --- */ .contnt p, div, th, td, li, dd { font-size: small; } .tiny p{ font-size: x-small; } /* FROM HERE ON THE STYLESHEET WILL BE THE MAIN CONTENT OF ALL WINDOWS - NOT JUST THE TEMPLATE LAYOUT */ #productoverview { width: 500px; border: 1px solid #000000; } /* LINKS WITHIN MAIN CONTENT AREA */ A.product:link, A.product:active, A.product:visited { COLOR: #336699; FONT-FAMILY: "Trebuchet MS", "Verdana","sans-serif"; FONT-WEIGHT: bold; TEXT-DECORATION: none; FONT-SIZE: small; } A.product:hover { COLOR: #990000; FONT-FAMILY: "Trebuchet MS", "Verdana","sans-serif"; FONT-WEIGHT: bold; TEXT-DECORATION: none; FONT-SIZE: small; } A:link, A:active, A:visited { COLOR: #000000; TEXT-DECORATION: underline; } A:hover { COLOR: #990000; TEXT-DECORATION: none; }
-
Sep 25, 2003, 06:19 #6
- Join Date
- May 2001
- Location
- toronto
- Posts
- 478
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
if i add this
Code:<div id="Layer1" style="position:absolute; left:180px; top:110px; z-index:1; width: 505px; padding-right: 10px; border-right: 1px dotted #999999;" class="contnt">
its really quite unfortunate that i have to support this old browser
i need to have a position: relative in StylesNN.css for it have scroll bars
*sigh*
-
Sep 25, 2003, 06:30 #7
- Join Date
- May 2003
- Location
- Liverpool
- Posts
- 361
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Absolute positioning takes elements out of the flow, so at different resolutions absolute positioned elements can overlap with relative ones. You could try giving a high z index to them.
-
Sep 25, 2003, 06:33 #8
- Join Date
- May 2001
- Location
- toronto
- Posts
- 478
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
but NN4 doesn't support z-index, and why does it lose the scroll bar with absolute position?
-
Sep 25, 2003, 06:42 #9
- Join Date
- May 2003
- Location
- Liverpool
- Posts
- 361
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Place the absolute elements inside containers with position relative, that'll place them back in the flow and reorder the content accordingly without overlapping.
-
Sep 25, 2003, 07:09 #10
- Join Date
- May 2001
- Location
- toronto
- Posts
- 478
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Code:StylesNN.css #mainrel { position: relative; left:175px; top:115px; width: 512px; } #main { position:absolute; } @import Styles.css #mainrel { position: relative; z-index: 99; left: 0; top: 0; } #main { position:absolute; left:175px; top: 115px; z-index:100; width: 512px; padding-right: 10px; border-right: 1px dotted #999999; } * html #main { width: 523px; w\idth: 512px; }
Code:<div id="mainrel"> <div id="main"> Stuff here </div> </div>
= scroll bars
=
thanks
Bookmarks