Page 1 of 2 12 LastLast
Results 1 to 10 of 11

Thread: what is best way/place to force vertical scroll bar on each page

  1. #1
    Senior Member TheeDragon's Avatar
    Join Date
    Mar 2013
    Posts
    195

    Default what is best way/place to force vertical scroll bar on each page

    see subject

    (and not by forcing each page layout to be tall
    or adding tall clear gifs )

    both are my current tricks

  2. #2
    Senior Member RayC's Avatar
    Join Date
    Apr 2010
    Location
    Toronto-ish, Canada
    Posts
    1,731

    Default

    Place the following code in the <HEAD> section of your MasterBorder(s)

    HTML Code:
    <style type="text/css">
    html { min-height: 100.2%; margin-bottom: 1px; }
    </style>
    Ray Cambpell
    Sounds In Sync
    Linked in

  3. #3
    Senior Member RayC's Avatar
    Join Date
    Apr 2010
    Location
    Toronto-ish, Canada
    Posts
    1,731

    Default

    Or, in Style View, click on the CSS Code tab and enter the following:

    HTML Code:
    BODY {overflow-y:scroll}
    If your CSS already has a BODY tag, you can insert it into the existing tag. For example, if you already have this:

    HTML Code:
    BODY {background-color : rgb(255,255,0)}
    you can change it to this:

    HTML Code:
    BODY {overflow-y:scroll; background-color : rgb(255,255,0)}
    Ray Cambpell
    Sounds In Sync
    Linked in

  4. #4
    Senior Member TheeDragon's Avatar
    Join Date
    Mar 2013
    Posts
    195

    Default

    i guess my sytax is wrong >? this is from my CSS code in style (v12)
    BODY { background-image : url( "Images\\Background.jpg" );
    background-repeat : repeat-x;
    font-family : Palatino Linotype ;
    font-size : 14px;
    color : rgb(153,153,153);
    background-color : rgb(39,51,58);
    overflow-y:scroll
    }
    the above wiped out my background image and color (ie just white)
    and there was NO vertical scroll bar

    BUT

    the following code IN the head tag of default border DID work = THANKS!
    <style type="text/css">
    html { min-height: 100.2%; margin-bottom: 1px; }
    </style>
    how can I fix my css ?

  5. #5
    Senior Member RayC's Avatar
    Join Date
    Apr 2010
    Location
    Toronto-ish, Canada
    Posts
    1,731

    Default

    Hmmm... strange. It works for me in 12 and 13, HTML4 and HTML5.

    Did it fix itself when you removed the overflow rule?
    Ray Cambpell
    Sounds In Sync
    Linked in

  6. #6
    Senior Member TheeDragon's Avatar
    Join Date
    Mar 2013
    Posts
    195

    Default

    oddly = NO
    still have white background

    argh !

    BODY { background-image : url( "../assets/images/Background.jpg" );
    background-repeat : repeat-x;
    font-family : Palatino Linotype ;
    font-size : 14px;
    color : rgb(153,153,153);
    background-color : rgb(39,51,58)
    }

  7. #7
    Senior Member RayC's Avatar
    Join Date
    Apr 2010
    Location
    Toronto-ish, Canada
    Posts
    1,731

    Default

    You must have accidentally entered or deleted a stray character somewhere nearby.

    Do the various settings still show under the Graphic tab? If not, re-set them. If so, try toggling them to something else then back again.

    If that doesn't help, try this:
    • Make a note of all the settings,
    • In Style View in the CSS Code tab, highlight the entire "BODY" section and delete it.
    • Go back to the Graphic tab (or wherever you prefer) and re-set all the various parameters.


    The location of the BODY rules may move, but they will be re-created. Check to see if that restores your styling.

    Then you can try inserting the extra rule again... if you dare!
    Ray Cambpell
    Sounds In Sync
    Linked in

  8. #8
    Senior Member TheeDragon's Avatar
    Join Date
    Mar 2013
    Posts
    195

    Default

    that's the odd part
    it looks ok on the style graphics page
    and all the pages look ok when editing
    (ie with correct background)
    but when publish = then background is white
    argh

    i will find it - just to play detective !

  9. #9
    Senior Member TheeDragon's Avatar
    Join Date
    Mar 2013
    Posts
    195

    Default

    pink panther here
    found it
    it was this
    <style type="text/css">
    in the head html from master border !

    guess I failed to delete it all from your sugesiton when I was 'testing' different modes
    <style type="text/css">
    html { min-height: 100.2%; margin-bottom: 1px; }
    </style>
    thanks for letting me vent

  10. #10
    Senior Member TheeDragon's Avatar
    Join Date
    Mar 2013
    Posts
    195

    Default

    WOW !

    great CSS code (now that I got it to work and not break !)
    as I said before, had been proud of my 'tricks to FORCE all pages to be TALL
    so I do not get the jump when pages with/without scroll
    (HATE THAT)

    was first 'annoyed' that I did not 'see' the scroll bar
    (using your suggested CSS code)
    but clearly - the page functions as though it were there !
    ie = no page hopping !

    in summary = LOVE learning new tricks !

    thanks again !

Posting Permissions

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