38 users online (1 members and 37 guests)  


  Results 1 to 10 of 10

Related

  1. Scrollbar in a cell in a table?    Forum: HTML Forum
    Replies: 6
  2. Scrollbar on table    Forum: CSS Forum
    Replies: 6
  3. Replies: 4
  4. Scrollbar, in or outside table    Forum: Website Scripts Forum
    Replies: 0
  1. #1
    xdeadd0llx's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Nov 2003
    Location
    Adelaide, Australia
    Posts
    25

    Hiding x-scrollbar (in table) with Netscape

    Hi folks

    I have a scrollbar "imbedded" in a smallish table (for want of a better word). I have done this using css (overflow: scrollbar; overflow-x: hidden; etc) then using the div tags... It looks rather fabulous in IE but Netscape (as per usual) is proving to be a pain. Not only must I tolerate the ugly silver borders and scrollbar overwriting my other css (bad enough) but it insists on adding the x-scrollbar also within the table.. which is not needed as the width is specified and it has nowhere to scroll. Opera also persists in doing this. Is there any way around it? I just want to minimize the content contradicting my aesthetic. While it's annoying having to constantly pander to Netscape specifications.. I'd love to fix this one Also, I just found this site and I have to say Dean, you've given me some GREAT ideas. Good work!

  2. #2
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Why thank you nice to hear kind words.

    Well, Netscape is always a fun one. How about giving us a link or your code so we can have a look?
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  3. #3
    xdeadd0llx's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Nov 2003
    Location
    Adelaide, Australia
    Posts
    25
    Ut-oh I think I disabled HTML code *giggle* Hope this works out..Anyways.. The table is a semi-crazy-nestled table as I've constructed it with .gif borders. I won't bog you down with all that code. I've just made a simple single cell-table with the same width etc. to test it out also and still with same results (Good in IE, bad Netscape). The best way for me to fit is as follows:

    <table width="420" height="350" cellpadding="0" cellspacing="0" border="1" bordercolor="#FF0080">
    <tr>
    <td>
    <div style="width: 420px; height: 350px; overflow: scrollbar; overflow-x: hidden; border: 0px; background-color: #000000;>
    <p>text etc.....</p>
    </div>
    </td>
    </tr>
    </table>

    I'm also having some trouble getting my external css for this to stick... as you can see I have to put the bulk of the format in the div tag there. Any suggestions to simplify/make my css work? This site is currently being developed and not online yet.. if you're still confused I'll put it up. Thankyou muchly

  4. #4
    xdeadd0llx's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Nov 2003
    Location
    Adelaide, Australia
    Posts
    25
    D'oh.. before everyone points out the mistake(s) hehe.. sorry about the typos - overflow: scrollbar; should of course be overflow: scroll; and I realise I forgot the " at the end of the div specifications. *Rolls eyes* It's been a long day.. and no, that's not why it doesn't work hehe I got it "right" on my real page lolol. Thanks!

  5. #5
    coothead's Avatar
    bald headed old fart

    Status
    Offline
    Join Date
    Aug 2003
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    732
    Hi there xdeadd0llx,

    Unfortunately
    overflow-x
    is I.E only so...
    Try this instead
    Code:
    <html>
    <head>
    <title>vertical scrollbar</title>
    
    <style type="text/css">
    <!--
    div
        {
         height:350px;
         overflow: auto; 
         border: 0px; 
         background-color: #000000;
        }
    table
        {
         width:420px;
         height:350px;
         padding:0;
         border: solid 1px #ff0080;
         border-collapse:collapse;
        }
    //-->
    </style>
    
    </head>
    <body>
    
    <table><tr>
    <td><div>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    <p>text etc.....</p><p>text etc.....</p>
    </div></td>
    </tr></table>
    
    </body>
    </html>
    I have tested this in I.E. 6.0, Netscape 7.1 and Mozilla Firebird.

    cthead

  6. #6
    xdeadd0llx's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Nov 2003
    Location
    Adelaide, Australia
    Posts
    25
    Fantastic!

    Thankyou both Dean and coothead for the interest and help. Your suggestion has worked brilliantly - I'm very pleased. I'll be quite sure to come here next time and pick everyone's brains! Thanks again

  7. #7
    nicholossia's Avatar
    Disabled

    Status
    Offline
    Join Date
    Oct 2003
    Location
    Oklahoma City, OK
    Posts
    8
    Just FYI, coothead's code also works in Safari 1.0.1
    Last edited by nicholossia; 01-13-2004 at 05:33 PM.

  8. #8
    HTML's Avatar
    Administrator

    Status
    Offline
    Join Date
    Aug 2000
    Posts
    3,445

    Follow HTML On Twitter Add HTML on Facebook Add HTML on Google+ Add HTML on Linkedin Visit HTML's Youtube Channel
    Thanks for letting us know

    Dave

  9. #9
    nicholossia's Avatar
    Disabled

    Status
    Offline
    Join Date
    Oct 2003
    Location
    Oklahoma City, OK
    Posts
    8
    I really like this approach to "embedded" scrollbars and have decided to use this method for my own webpage. I've designed the page in html with tables and it looks good. Now, I'd like to embed the scrollable area into an existing cell. Whenever I paste the <style> code from coothead's post, my page gets all kinds of wacky. I'm guessing there is some conflict in there between the css style "div" and "table" commands, considering that they are the same as those found in the basic html. Is there a way to differentiate between the css based table/div and those found in the rest of the code?
    I'm sure you've figured out by now that I'm extremely new to css, this being my first attempt. I've read the css tutorial linked at the top of this forum, but didn't quite figure out how this all works. Any pointers or suggested tutorials would help very much.

  10. #10
    nicholossia's Avatar
    Disabled

    Status
    Offline
    Join Date
    Oct 2003
    Location
    Oklahoma City, OK
    Posts
    8
    Well, I think I figured something out by using table.one and <table class="one">... at least it looks and works the way I'd like. I could still use some good tutorials for future coding if you can recommend some that would help. Hopefully I'll have this site up soon and would love it if you guys would critique the code. Until then, I'll just keep asking questions and thanking you for all the help.
    Thanks,
    Nicholi
    Last edited by nicholossia; 01-14-2004 at 12:25 AM.



Tags for this Thread