Back To Website Design Forum

Scrollable Divider not working in Safari

  • bradymills
  • Beginner
  • Beginner
  • User avatar
  • Joined: Nov 23, 2005
  • Posts: 58
  • Loc: Nashville, TN
  • Status: Offline

Post September 28th, 2006, 6:53 pm

Can someone tell me why a scrollable divider isn't working in safari? It works perfectly in IE. Is it not supported? Is there something I can do to force safari to accept it?

Thanks,
Brady

Here's the CSS:
Code: [ Select ]
#indexcontent {
    font: 80% bold Times New Roman, Times, serif;
    text-align: justify;
    color: #333333;
    width: 535px;
    height: 300px;
    padding-right: 10px;
    padding-bottom: 10px;
    overflow: -moz-scrollbars-vertical;
    overflow-x: hidden;
    overflow-y: scroll;
    scrollbar-arrow-color: #666666;
    scrollbar-track-color: #FFFFFF;
    scrollbar-shadow-color: #666666;
    scrollbar-slider-color: #FFFFFF;
    scrollbar-face-color: #FFFFFF;
    scrollbar-highlight-color: #FFFFFF;
    scrollbar-darkshadow-color:#FFFFFF;
    scrollbar-3dlight-color: #666666;
}
  1. #indexcontent {
  2.     font: 80% bold Times New Roman, Times, serif;
  3.     text-align: justify;
  4.     color: #333333;
  5.     width: 535px;
  6.     height: 300px;
  7.     padding-right: 10px;
  8.     padding-bottom: 10px;
  9.     overflow: -moz-scrollbars-vertical;
  10.     overflow-x: hidden;
  11.     overflow-y: scroll;
  12.     scrollbar-arrow-color: #666666;
  13.     scrollbar-track-color: #FFFFFF;
  14.     scrollbar-shadow-color: #666666;
  15.     scrollbar-slider-color: #FFFFFF;
  16.     scrollbar-face-color: #FFFFFF;
  17.     scrollbar-highlight-color: #FFFFFF;
  18.     scrollbar-darkshadow-color:#FFFFFF;
  19.     scrollbar-3dlight-color: #666666;
  20. }


Here's the HTML:
Code: [ Select ]

<div id="indexcontent">

<!--Main content Goes here--->

<p>Content, blahblahblah</p>

 <!--Main Content Ends here--->
</div>    
  2. <div id="indexcontent">
  4. <!--Main content Goes here--->
  6. <p>Content, blahblahblah</p>
  8.  <!--Main Content Ends here--->
  9. </div>    
  • Anonymous
  • Bot
  • No Avatar
  • Joined: 25 Feb 2008
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post September 28th, 2006, 6:53 pm

  • bradymills
  • Beginner
  • Beginner
  • User avatar
  • Joined: Nov 23, 2005
  • Posts: 58
  • Loc: Nashville, TN
  • Status: Offline

Post October 20th, 2006, 5:08 pm

I found a solution to this, just thought I'd share -- in case someone else had this problem. I'm still learning lots of stuff -- so a huge knowledge base like this site -- always comes in useful...

I simply replaced overflow - x, overflow-y, etc... with

overflow: auto;
overflow-y: auto;
overflow-x: hidden;

seems to work fine now... in safari, ie, etc...
  • tiranhay
  • Born
  • Born
  • No Avatar
  • Joined: Oct 02, 2007
  • Posts: 1
  • Status: Offline

Post October 2nd, 2007, 12:06 am

Thanks alot brady!
It works perfectly.
  • mayumi
  • Born
  • Born
  • No Avatar
  • Joined: Dec 10, 2009
  • Posts: 1
  • Status: Offline

Post December 10th, 2009, 5:06 am

Thanks bradymills! Worked perfectly for my problem. Keep on sharing. ;)

Page 1 of 1

Post Information

  • Total Posts in this topic: 4 posts
  • Users browsing this forum: No registered users and 112 guests
  • 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 post attachments in this forum
 
 

© 2011 Unmelted, LLC. Ozzu® is a registered trademark of Unmelted, LLC.