SitePoint Sponsor

User Tag List

Results 1 to 22 of 22
  1. #1
    SitePoint Zealot superbrava's Avatar
    Join Date
    Aug 2001
    Location
    Indianapolis, IN
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS Scrollbar problems!!!!

    I am pretty good when it comes to writing clean CSS, but i cannot get the scrollbar color thing to work for IE6. On the other hand, my browser supports it because it always shows other sites that has the stylesheet attributes. Here is my code, can you maybe tell me why it is not working?

    Code:
    body {
    			margin-top: 0px;
    			margin-left: 0px;
    			margin-right: 0px;
    			margin-bottom: 0px;
    			background: #FFFFFF;
    			scrollbar-face-color: #1B348E;
    			scrollbar-shadow-color: #000000;
    			scrollbar-highlight-color: #777777;
    			scrollbar-3dlight-color: #666666;
    			scrollbar-darkshadow-color: #303030;
    			scrollbar-track-color: #7470BC;
    			scrollbar-arrow-color: #FFFFFF;
    			font-family: verdana, arial;
    			font-size: 8pt;
    			font-weight: none;
    			font-style: none;
    			text-decoration: none;
    			color: #000000;}
    Any ideas why this wont work?
    Steve v3.2.2 running on LocalSuck port 80

  2. #2
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's odd, but works fine for me!

    I just wrapped it in style tags and saved it as a HTML file for Explorer to look at. Does anything else go wrong on the page? Perhaps there's a markup error elsewhere on it.

    BTW, scrollbar colors aren't really part of CSS--they're yet another add-on from Microsoft. But I don't really mind too much because it doesn't affect me in my Mozy. Although, your CSS won't validate with them, if that's important to you. :-)

    ~~Ian
    Last edited by Ian Glass; Sep 8, 2002 at 11:41.

  3. #3
    SitePoint Zealot superbrava's Avatar
    Join Date
    Aug 2001
    Location
    Indianapolis, IN
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    everything else works fine, i just wanted to keep the scrollbar the same color theme as my site. like sitepoint for example. i never have a problem with css, i never used to have a problem with this before, but now all the sudden it wont work.

    i link from an external stylesheet, but i've tried it both ways.
    Steve v3.2.2 running on LocalSuck port 80

  4. #4
    SitePoint Zealot superbrava's Avatar
    Join Date
    Aug 2001
    Location
    Indianapolis, IN
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS Validation

    it's funny that i've learned most of all the css i know from books, but the attributes they use won't validate. lol. this is flat out stupid. like "font-weight: none;"... i've seen that in many books, but w3c doesn't say that's valid... crappy.
    Steve v3.2.2 running on LocalSuck port 80

  5. #5
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Font-weight's indeed a valid property; it's "none" that's tripping you up. If you could specify text to have no weight, you wouldn't be able to read it, now would you? ;-)

    I'm guessing you want normal, but there you could also go bold, bolder, and lighter, as well as 100, 200, 300, 400, 500, 600, 700, 800, and 900 (do to the limitations of PC monitors, all of those won't look different except at extremely large sizes). :-)

    ~~Ian

  6. #6
    SitePoint Zealot superbrava's Avatar
    Join Date
    Aug 2001
    Location
    Indianapolis, IN
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    i was refering to the "none" part also. i use that, as i've been showed in books, it's just funny that they teach it wrong. lol. where is a good reference that is correct for CSS?

    Thanks!
    Steve v3.2.2 running on LocalSuck port 80

  7. #7
    SitePoint Wizard
    Join Date
    Oct 2001
    Location
    Tucson, Arizona
    Posts
    1,858
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by superbrava
    i never have a problem with css, i never used to have a problem with this before, but now all the sudden it wont work.
    Are you using a DOCTYPE in your pages by any chance?

  8. #8
    SitePoint Wizard Ian Glass's Avatar
    Join Date
    Oct 2001
    Location
    Beyond yonder
    Posts
    2,384
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by superbrava
    where is a good reference that is correct for CSS?
    From the horse's mouth... ;-)

    BTW, you recall which book said to use none?

    ~~Ian

  9. #9
    Grumpy Mole Man Skunk's Avatar
    Join Date
    Jan 2001
    Location
    Lawrence, Kansas
    Posts
    2,066
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    What Matt said. IE6 will not display coloured scroll bars when it is in "standards" mode, which is triggered by a DOCTYPE. This is a good thing - coloured scroll bars are an unnecessary and invalid Microsoft extension to the CSS specification.

  10. #10
    SitePoint Zealot superbrava's Avatar
    Join Date
    Aug 2001
    Location
    Indianapolis, IN
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is my code... i'm lost here . lol

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
    <html>
    <head>
    <title>Hellcat's Revenge - The Official Site!</title>
    <meta name="author" content="stephen dill">
    <meta name="copyright" content="© copyright 2002 Hellcat's Revenge">
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="robots" content="index,follow">
    <meta name="revisit-after" content="7 days">
    <meta name="distribution" content="global">
    <meta name="reply-to" content="s.dill@thinkist.net">
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="content-style-type" content="text/css">
    <meta http-equiv="content-script-type" content="text/javascript">
    <link rel="stylesheet" href="./css/default.css" media="all">
    <script src="./scripts/client/functions.js"></script>
    </head>
    <body>
    anything with the media attribute in the link tag also?
    Steve v3.2.2 running on LocalSuck port 80

  11. #11
    SitePoint Zealot superbrava's Avatar
    Join Date
    Aug 2001
    Location
    Indianapolis, IN
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    by taking away the doctype it worked.. how can i still use a doctype and use the scrollbar effect? i just want it to blend in with the site, the site is for an underground zine, so it's not a pro site by any means.
    Steve v3.2.2 running on LocalSuck port 80

  12. #12
    (****** or Deleted)
    Join Date
    May 2002
    Location
    Melbourne, Australia
    Posts
    299
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I do not believe you can use the DOCTYPE and keep the coloured scroll bars, the DOCTYPE is a set of rules for the browser to adhere to, and as the scroll bar colours are not part of the CSS spec, they are not a valid attribute to change...

    One option though is to create your own edited DOCTYPE and store it on your own server, I am sure fi you chack out the w3c one you will be able to edit it easily enough, never tried though...

  13. #13
    SitePoint Wizard Bill Posters's Avatar
    Join Date
    Dec 2001
    Location
    UK
    Posts
    1,523
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Originally posted by superbrava
    where is a good reference that is correct for CSS?
    Also W3Schools.com/css.

    A good reference site for W3C CSS.
    Imo, much better organised and much more useful as a reference site than W3C's own CSS pages (which are simply badly organised and too dry in their presentation.)
    New Plastic Arts: Visual Communication | DesignateOnline

    Mate went to NY and all he got me was this lousy signature

  14. #14
    SitePoint Zealot 19nine78's Avatar
    Join Date
    Feb 2002
    Location
    Ayr, scotland
    Posts
    135
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    try applying your scrollbar styles to html not body. e.g.

    html{
    scrollbar-face-color: #1B348E;
    scrollbar-shadow-color: #000000;
    scrollbar-highlight-color: #777777;
    scrollbar-3dlight-color: #666666;
    scrollbar-darkshadow-color: #303030;
    scrollbar-track-color: #7470BC;
    scrollbar-arrow-color: #FFFFFF;
    }

    When in standards mode IE6 applies the overflow to the HTML element NOT the body element.

    cheers

    alastair

  15. #15
    SitePoint Zealot superbrava's Avatar
    Join Date
    Aug 2001
    Location
    Indianapolis, IN
    Posts
    104
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You can use this doctype

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    This is used right here at SitePoint Forums.

    Yeah, i hate the w3c pages. They are very badly organized and presented. They could be alot better since they "hold the standards".. hehe.
    Steve v3.2.2 running on LocalSuck port 80

  16. #16
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    the w3c pages are done by techies, for techies. most of the information centres around implementation in user agents etc...it's not meant to be a reference for web developers...
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com

  17. #17
    SitePoint Addict Kakarot720's Avatar
    Join Date
    Feb 2001
    Location
    Washington DC
    Posts
    219
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    what's your point Redux?

    the w3c pages are done by techies, for techies. most of the information centres around implementation in user agents etc...it's not meant to be a reference for web developers...
    Redux, you say that like it makes it OK for the W3C web site to have terrible usability and super ugly presentation.
    I have to agree with Superbrava the W3C site could use a major overhaul...

  18. #18
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    no, it doesn' make it ok, it just explains why it is the way it is
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com

  19. #19
    SitePoint Zealot
    Join Date
    Mar 2003
    Location
    43° 03' 16" N :::: 77° 36' 03" W
    Posts
    183
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by superbrava
    ...i hate the w3c pages. They are very badly organized and presented. They could be alot better since they "hold the standards".. hehe.
    i was thinking the same thing

    too many pages there you have to scroll 40 miles down to get to what you need. it needs much better organization than what it has

  20. #20
    100% Windoze-free earther's Avatar
    Join Date
    Feb 2003
    Location
    Linuxland
    Posts
    2,788
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My custom scrollbar works just fine with a 4.01 transitional DOCTYPE. The HTML code validates at W3C but not the CSS because of the scrollbar. I put mine in an embedded style sheet at the top of the document along with my hover links rather than in the body tag.

  21. #21
    SitePoint Wizard LeoWebDesign's Avatar
    Join Date
    Nov 2002
    Location
    Central PA
    Posts
    1,146
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by superbrava
    where is a good reference that is correct for CSS?

    Thanks!
    Steve,

    The best book out there is Cascading Style Sheets- The Definitive Guide by Eric Meyer. It's an O'Reilly book.

  22. #22
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    Well, if you want to apply valid Cascading Style Sheets (CSS) and have the coloured scrollbar to appear within Micro$oft the only clear option is to use multiple sheets, having a separate file for the scrollbar CSS so it doesn't interfere with the other valid styles and only reference the non-propriety CSS, it's not good practice but doesn't break any rules.

    Albeit consider that the browser's scrollbar is part of the 'user-interface' rather than the canvas and CSS was designed to allow authors to attach styles to structured documents rather than the browser itself - I don't want any wisecracks about XUL, etc.

    Basically the W3C CSS 2.1 Draft was designed to be read by CSS authors and CSS implementers and is a Technical Recommendation rather than a tutorial and doesn't have to be read in from cover to cover to get a good understanding of CSS, and I would agree many CSS tutorials have syntax errors.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •