473,480 Members | 4,827 Online
Bytes | Software Development & Data Engineering Community
Create Post

Home Posts Topics Members FAQ

Horizontal scrollable DIV

31 New Member
Hi,
I am designing my page in PHP,
I have a div in which is dynamically generating contents.
But when the contents are more, then alignment is disturbed.
so need that div should be horizontal scrollable and it should not affect the width of div.

So i need div should be auto scrollable.
Thanks in Advance
Nov 18 '09 #1
4 3852
acoder
16,027 Recognized Expert Moderator MVP
Give it a width and set overflow to "auto".
Nov 20 '09 #2
Frinavale
9,735 Recognized Expert Moderator Expert
Use CSS to set the div to the desired width.

Then use CSS to specify that the div should scroll if the content is too wide for the div.

To set the div to scroll of the content within it is to wide for the div use the overflow style.

-Frinny
Nov 20 '09 #3
romepatel
31 New Member
I had that but still am unable to get horizontal scrollbar for DIV tag......
I it is wroking in IE, but not in Firefox 3.5

<div style="width:245px; padding-left:0px; height:415px; padding-top:5px; position:absolute; overflow:auto;" >

....some content.......

</div>
Nov 23 '09 #4
Frinavale
9,735 Recognized Expert Moderator Expert
If your content is just plain text it appears that it is wrapped if you set your overflow:scroll or overflow:auto.

Try placing the text in a <span> or <p> or <div> with a display style of block and give it a large width:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <html>
  3. <head>
  4.   <style type="text/css">
  5.     div
  6.     {
  7.       border:thin solid green;
  8.       width:100px;
  9.       overflow:auto;
  10.     }
  11.   </style>
  12. </head>
  13. <body>
  14.   <div>
  15.     <span style="display:block; width:200px;">
  16.       This is some text. La la la. Da da da.
  17.       This is some text. La la la. Da da da.
  18.       This is some text. La la la. Da da da.
  19.       ....some content.......
  20.     </span>
  21.   </div> 
  22.  
  23. </body>
  24. </html>
  25.  
Nov 23 '09 #5

Sign in to post your reply or Sign up for a free account.

Similar topics

7
11634
by: Matt Kruse | last post by:
This is a typical layout, but I have specific requirements. I'm trying to figure out a) if it's possible to meet the requirements and b) if so, how. +---------------+ | header |...
3
3276
by: sumit | last post by:
Hi, I made a data grid vertically as well as horizontal scrollable as number of columns are very large!! But when i scroll horizontally then header is not visible as it also gets scrolled...
2
7653
by: Brian | last post by:
Is there a way to remove the horizontal scroll bar on a TreeView control? I want to keep the vertical one.
5
2147
by: Brian Henry | last post by:
Hello, I want to make a control that has a scrollable Gantt type display (not really one but will look similar to one) this is going to be custom drawn (i already have the drawing procedure...
3
14172
by: Seni Seven | last post by:
Extensive Google searching for more than a couple of hours has not provided me with a satisfactory answer to this question: How can I make scrollable TBODY elements in tables which: * create...
2
4059
by: Ben H | last post by:
Hello all I'm using a listview in my app but I want to scroll the listview programatically as I hate the look of the standard scrollbar. So, the listview is scrolled programatically using...
1
16924
by: since | last post by:
I figured I would post my solution to the following. Resizable column tables. Search and replace values in a table. (IE only) Scrollable tables. Sortable tables. It is based on a lot...
1
3484
by: Red Head | last post by:
Hello :) I would like to have an horizontal image list where you can drag and drop the images to reorder them (like slide reorder in powerpoint, but then in an horizontal way) so i had a look...
3
2832
by: romepatel | last post by:
Hi, In Page I have a <div div style="width:245px; padding-left:0px; height:415px; padding-top:5px; position:absolute; overflow:auto;"> </div> In IE , it is working fine, I can see Vertical...
0
7040
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
7080
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
6908
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
5331
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...
1
4772
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...
0
4478
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
0
2980
by: adsilva | last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
1
561
muto222
php
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
0
178
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.