SitePoint Sponsor

User Tag List

Results 1 to 4 of 4

Hybrid View

  1. #1
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,718
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Show horizontal scroll not vertical on div?

    Hi All

    Having trouble forcing a horizontal scroll bar on a div container.

    I want the overall size to stay fixed but extend the width with a scroll bar horizontally, instead of jumping onto a new line with a vertical scroll bar.

    Code HTML4Strict:
    <div id="photoDisplay">
    	<img src="images/test001.jpg">
    	<img src="images/test002.jpg">
    	<img src="images/test003.jpg">
    	<img src="images/test004.jpg">
    	<img src="images/test005.jpg">
    	<img src="images/test006.jpg">
    </div>

    Code CSS:
    div#photoDisplay {
    	padding: 20px;
    	height: 208px;
    	width: 732px;
    	overflow:auto;
    	float:left;
    }

    ???
    The more you learn.... the more you learn there is more to learn.

  2. #2
    I meant that to happen silver trophybronze trophy Raffles's Avatar
    Join Date
    Sep 2005
    Location
    Tanzania
    Posts
    4,662
    Mentioned
    2 Post(s)
    Tagged
    0 Thread(s)
    You can "fine-tune" the overflow property to the horizontal and vertical axes:

    Code:
    overflow-x:scroll;
    overflow-y:hidden;

  3. #3
    SitePoint Wizard bronze trophy PicnicTutorials's Avatar
    Join Date
    Dec 2007
    Location
    Carlsbad, California, United States
    Posts
    3,656
    Mentioned
    15 Post(s)
    Tagged
    0 Thread(s)
    Sounds like your looking for this... http://www.visibilityinherit.com/code/scroller.php

  4. #4
    SitePoint Wizard
    Join Date
    Dec 2005
    Posts
    1,718
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks for the input Raffles.

    Sounds like your looking for this...
    Spot on! Just reading through now, thank you
    The more you learn.... the more you learn there is more to learn.


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
  •