 |
|
|
| View previous topic :: View next topic |
| Author |
Message |
Bazjra
Joined: 26 Mar 2008 Posts: 3
|
Posted: Wed Mar 26, 2008 1:10 pm Positioning Scrollbar in Table |
|
|
|
I'm trying to place a scrollbar in a specific location on my background image but I can't find the proper code to do it. The scrollbar is supposed to be over the light box in the image (click!)
Here's what I've got at the moment:
| Code: |
<center><table bordercolor="#000000" width="425" bgcolor=#FEF9F5 borderrules="none"><tr><td><img src="http://i6.photobucket.com/albums/y232/Kattadin/APaA/fritz-1.png" align=left"></td><td><div style=" width:250px; height:350px; overflow:auto; padding:35px" STYLE= "scrollbar-face-color: #D0CDD4; scrollbar-highlight-color: #ffffff; scrollbar-3dlight-color: #ffffff; scrollbar-darkshadow-color: #635B6A; scrollbar-shadow-color: #6F617B; scrollbar-arrow-color: #000000; scrollbar-track-color: #4E4865">
<p align="justify"><font face="verdana" color="#7C749D">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br /></font></p></div></td></tr></table></center> |
|
|
PayneLess Designs

Joined: 28 Feb 2007 Posts: 624 Location: Biloxi, MS
|
Posted: Mon Apr 28, 2008 2:23 am |
|
|
|
Replace overflow:auto; with overflow:scroll; and you'll get a scroll bar showing. It will not have a scroll tab until you have enough overflow which would have triggered a scroll bar anyway.
All that scroll code for colors, etc., is only good for IE and IE driven browser engines. No other browser will show all those colors for a scroll bar.
Ron |
|
Bazjra
Joined: 26 Mar 2008 Posts: 3
|
Posted: Mon Apr 28, 2008 5:04 am |
|
|
|
| Okay. Thanks for your help! |
|
Straystudio
Joined: 14 Apr 2008 Posts: 218 Location: Nord Italy
|
Posted: Mon Apr 28, 2008 6:02 am overflow:auto; and overflow:scroll; % fooled in table |
|
|
|
padding:35px wants its ; semicolon.
You simply entered not enough text to fill, the height:350px; You assigned to the div.
By doubling the text content, overflow:auto; will enter in play.
I second "PayneLess Designs" about how overflow:scroll; works.
Be aware having a div overflow: ; inside a table:
as long as You set div height in pixel, no problem sorts out;
layout gets fooled with both overflow:auto; and overflow:scroll; if You use % percentuage, instead.
|
|
Bazjra
Joined: 26 Mar 2008 Posts: 3
|
Posted: Mon Apr 28, 2008 7:50 am |
|
|
|
Hm... Tried out everything that was mentioned (I'd shortened my text purposefully, though) and it still looked the same as before, with the scrollbar on the right side instead of in the middle.
A friend of mine does similar stuff with her scrollbars (successfully, I might add), so I ended up finding one of her codes (I couldn't before due to a stupid bug with stupid Proboards v4.5). And it worked. Oh, I did color the scrollbars -- what would it show up as on browsers that don't use IE?
I'm going to fiddle around with it and see if I can trim it down some -- figure out what works where.
| Code: |
| <table border="0"><div id="layer1" style="background-image:url(http://i6.photobucket.com/albums/y232/Kattadin/APaA/fritz-1.png); layer-background-image:url(http://i6.photobucket.com/albums/y232/Kattadin/APaA/fritz-1.png); width:500px; height:643px; z-index:1"><div id="layer2" style="position:relative; left:70px; top:290px; width:197px; height:300px; ; z-index:2; overflow:auto; padding:0px; scrollbar-face-color: #AF9674; scrollbar-highlight-color: #B69D76; scrollbar-3dlight-color: #B69D76; scrollbar-darkshadow-color: #B69D76; scrollbar-shadow-color: #977950; scrollbar-arrow-color: #826039; scrollbar-track-color: transparent"><font face="Verdana" size="1" color="#000000">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.<br><br>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</font></div></div></table> |
|
|
|
|
You cannot post new topics in this forum You cannot reply to topics in this forum You cannot edit your posts in this forum You cannot delete your posts in this forum You cannot vote in polls in this forum
|
|
|
|
|
 |
|
|
|
|
|
|