Results 1 to 5 of 5

Thread: Scrollbar problem

  1. #1

    Thread Starter
    New Member
    Join Date
    Jun 2005
    Posts
    1

    Scrollbar problem

    Hi

    Im new with Php

    Im trying to put a little php script together and there seems to be one last problem:

    The page contains a textpanel with a scrollbar that exactly fits the background foto i use. the background foto fits the browser window.

    for some reason the browser itself has a scrollbar too. this is very ennoying since whenever you turn your mousewheel you scroll down to a black empty space.

    First i tried getting around by disabling the mouse wheel in html but it is not possible.I couldn't find any java scripts that wo do that for me and i am not smart enough to write one myself

    I tried positioning the textpanel differently, but the only thing that would affect the page height (and black empty space and remove scrollbar) was reducing the textpanels height. which also reduces my textpanels height
    which is not good...

    can anyone see the problem here?

    Code:
    <html xmlns="">
    
    <head>
    	<title>titel</title>
    
    	<style type="text/css">
    	
    		body {
    			background: black;
    			font-family: sans-serif;
    		}
    
    		div.contentPane {
    			width: 936px;
    			height: 600px;
    
    			margin: auto auto auto auto;
    		}
    
    		div.textPane {
    			position: relative;
    			left: 270px;
    			top: -400px;
    
    			width: 650px;
    			height: 430px;
    			
    			overflow: auto; 
    
    		}
    
    		img {
    			id="offset"
    			position: relative;
    			border: none;
    			text-decoration: none;
    		}
    
    		span.bold { font-weight: bold; }
    		span.italic { font-style: italic; }
    
    		table.overzicht td.title {						
    			font-weight: bold;
    			background: rgb(215,84,30);
    			color: rgb(254,201,9);
    		}
    
    		table.overzicht td.font0 {
    			font-size: 95%;
    			font-style:normal;
    			text-decoration:none;
    			font-family: sans-serif;
    		}
    
    		table.overzicht td.font8 {
    			font-size: 115%;
    			text-decoration:none;
    			font-family: sans-serif;
    		}
    
    		table.overzicht td.font5 {
    			font-size: 110%;
    			text-decoration:none;
    			font-family: sans-serif;
    		}
    
    		table.overzicht td.font10 {
    			font-size: 145%;
    			text-decoration:none;
    			font-family: sans-serif;
    		}
    
    		table.overzicht td.font11 {
    			font-size: 145%;
    			text-decoration:none;
    			font-family: sans-serif;
    		}
    
    		table.overzicht td.font13 {
    			font-size: 120%;;
    			text-decoration:none;
    			font-family: sans-serif;
    		}
    
    		div.footer {
    			margin-left: auto;
    			margin-right: auto;
    			width: 100%;
    			text-align: center;
    			margin-top: 2em;
    			height: 1px;
    		}
    	</style>
    </head>
    
    <body id="offset">
    	<map id="map" name="map">
    		<area coords="230,185,60,220" href="index.htm" alt="Home" />
    		<area coords="50,246,247,288" href="beach_backup2.php?page=overzicht" alt="Overzicht" />
    		<area coords="52,304,248,330" href="beach_backup2.php?page=vrijdag" alt="Vrijdag" />
    		<area coords="50,343,250,363" href="beach_backup2.php?page=zaterdag" alt="Zaterdag" />
    		<area coords="52,384,250,402" href="beach_backup2.php?page=zondag" alt="Zondag" />
    		<area coords="53,421,248,466" href="beach_backup2.php?page=tickets" alt="Locatie" alt="Tickets" />
    		<area coords="55,486,247,517" href="beach_backup2.php?page=locatie" alt="Locatie" />
    		" alt="Partners" />	
    </map>
    			
    	<div class="contentPane">
    		<img src="" usemap="#map" alt="Page spanning image map." />
    		<div class="textPane">
    
    
    <?php if ($_GET['page'] == "vrijdag") { ?>
    
    	
    <?php } else if ($_GET['page'] == "zaterdag") { ?>
    
    	
    <?php } else if ($_GET['page'] == "zondag") { ?>
    
    
    <?php } else if ($_GET['page'] == "tickets") { ?>
    
    
    <?php } else if ($_GET['page'] == "locatie") { ?>
    
    under construction
    
    <?php } else if ($_GET['page'] == "partners") { ?>
    
    <?php } else { ?>
    
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    tabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabeltabel
    			
    <?php } ?>
    			</div>
    	</div>
    </body>
    </html>
    i'm sweating on this one for 2 days now and i really hope to find an answer here...

    thanks in advance!!!
    Last edited by PhpNoobie; Jun 15th, 2005 at 04:56 PM.

  2. #2
    Fanatic Member ALL's Avatar
    Join Date
    Jul 2004
    Location
    192.168.1.1
    Posts
    711

    Re: Scrollbar problem

    i am having a hard time understanding what you mean?!?!

    NOTE: this should probably be in the HTML secion, it sounds like HTML more than PHP
    Please support one of my projects?
    TKForums.com

    Web Forum
    JavaScript Wiki
    ________________________
    If somone helps you, please rate their post, by clicking the to rate their post

  3. #3
    Addicted Member
    Join Date
    Nov 2003
    Location
    Gent
    Posts
    166

    Re: Scrollbar problem

    The Problem is that there is a black empty space on the bottom of the page.
    I don't know why and the only way i can reduce the black space is by reducing the textpanel's height .

    Because of the black empty space my page will have a scrollbar which will make my whole page go up or down (to the black empty space). People who enter the site will always do this because they think they will scroll inside the smaller textpanel.(with the mousewheel)

    I guess it has something to do with finding the right properties for the textpanel but i can't seem to figure it out...

    any help would be greatly appreciated, more info can be given...
    Last edited by demoti; Jun 16th, 2005 at 04:44 AM.
    never argue with an idiot, he will bring you down to his level and will beat you through experience

  4. #4
    Addicted Member
    Join Date
    Nov 2003
    Location
    Gent
    Posts
    166

    Re: Scrollbar problem

    Bump
    never argue with an idiot, he will bring you down to his level and will beat you through experience

  5. #5
    Kitten CornedBee's Avatar
    Join Date
    Aug 2001
    Location
    In a microchip!
    Posts
    11,594

    Re: Scrollbar problem

    Have you considered what happens when the user resizes the browser? Has various toolbars installed? Runs at a different resolution?

    Trying to make a page fit perfectly is an illusion.

    As for the black space, try adding this rule to your stylesheet:
    Code:
    html, body, form, textarea {
      margin: 0;
      padding: 0;
    }
    Also, get Firefox and use its DOM inspector to find out just which element takes up that extra space.
    All the buzzt
    CornedBee

    "Writing specifications is like writing a novel. Writing code is like writing poetry."
    - Anonymous, published by Raymond Chen

    Don't PM me with your problems, I scan most of the forums daily. If you do PM me, I will not answer your question.

Posting Permissions

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



Click Here to Expand Forum to Full Width