HTML - Scroll Bar: Yes Vertical, No Horizontal

I need help with making a vertical scroll box w/ table just dont know the html code for a vertical scroll box.. I know the table but i dont think its right.
___
<table border="1">
<tr>
<th>Heading</th>
<th>Another Heading</th>
</tr>
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
</table>
___

Thanx in Advance!

Hi!

I am having problems with horizontal scroll-bar. The thing is horizontal scroll-bar appears in local view. But when I put it into web only horizontal scroll-bar disappears.
I'm using swffit also, and tried lots of things to solve this but coulnd't manage to solve this weird problem.

Anyone has an idea?
Thanks in advance.

site link is www.firinciorhan.com.tr

Hi

i am having html page which have <frameset> of 7 frames.

See below source for that frameset

<frameset rows="115,13,*,100" frameborder="no" border="0" framespacing="0">

<frameset cols="*,11" frameborder="no" border="0" framespacing="0">
<frame src="headerPageTop.html" name="topPage" scrolling="no" noresize="noresize" />
<frame src="headerRightPanel.html" name="header_rightpanel" scrolling="No" />
</frameset>

<frameset cols="*,22" frameborder="no" border="0" framespacing="0">
<frame src="headerPageBotton.html" name="header_rightpanel" scrolling="No" />
<frame src="headerRightPanelBottom.html" name="header_rightpanel" scrolling="No" />
</frameset>

<frameset cols="163,*,22" frameborder="no" border="0" framespacing="0" marginheight="0" marginwidth="0" topmargin="0">
<frame src="leftPage.html" name="leftPage" scrolling="No" noresize="noresize" />
<frame src="../system/deviceView/deviceView.html" name="contentPage" />
<frame src="rightPanel.html" scrolling="No" name="rightpanel" />
</frameset>

<frame src="bottomPage.html" name="bottomFrame" scrolling="No" />
</frameset>


Solution required is when the user reduce the window size topframe having image menu getting hidden. So we need to provide a horizontal bar common for all the frames.

Can you please suggest the best solution with will working for IE, Firefox & Netscape.

regards
Sudhakar S

I don't know how this got here, but I don't have any absolute width defined anywhere, I'm viewing the site on 1280x800 resolution, and I have a horizontal scroll bar... have a look if you want.

www.bkriegtech.net

Thanks for any help...

How I can set the scrool bar so that the vertical bar will show? When the typed text exceeds the horizontal space area, cursor will be moved into next line without hitting the Enter key.

i have script that shown image in table, i want the table shown in horizontal not vertical
this is the entire script, and the table that influence is in the red i think below

any idea guys what i need to edit?




Quote:
# Photo Album
# 1.1
#
# Displays a members photos
class user_photoplog_album extends z_module
{
# Set the maximum amount of images any users are allowed to display
var $max_images = 5;
function contents()
{
$content = $this->content;
$vbulletin = $this->_zoints->external->vbulletin;

# If limit hasnt been set or is over the admin set maximum, set it to the admin max
if(empty($content['max_pics']) OR $content['max_pics'] > $this->max_images)
{
$limit_sql = 'LIMIT ' . $this->max_images;
}
# Otherwise, let them set it
else
{
$limit_sql = 'LIMIT ' . $content['max_pics'];
}

# Get all photos the user has
$getphotos = $vbulletin->db->query_read("
SELECT * FROM " . TABLE_PREFIX . "photoplog_fileuploads
WHERE userid=" . $this->zuser . "
AND moderate=0
ORDER BY dateline DESC
" . $limit_sql . "
");
$html .= '<div class="' . $this->style['pmain1'] . '" style="padding: 0;">';

# Does the user have any photos?
if ($vbulletin->db->num_rows($getphotos))
{
# Display the top of the table
$html .= '
<table border="0" width="100%">
<tr>
<td width="100" overflow-x: scroll; overflow-y: hidden; align="center" class="phead">
Image
</td>';
# Display the details?
if(!$content['details'])
{
$html .= ' ';
}
$html .= ' </tr>';

# loop and display all that have been fetched from the DB
while($photo = $vbulletin->db->fetch_array($getphotos))
{
# Display image cell
$html .= '
<tr>
<td width="100" align="center" class="pmain2">
<a href="' . $this->_zoints->external->url() . 'imagehosting/image' . $photo['fileid'] . '.html" target="_blank"">
<img src="' . $this->_zoints->external->url() . 'imagehosting/images/' . $photo['userid'] . '/small/' . $photo['filename'] . '" />
</a>
</td>
'; # Display the image details?
if(!$content['details'])
{
$html .= ' ';
}
$html .= '</tr>';
}
$html .= '</table>
<p><a href="index.php?u=' . $this->zuser . '" target="_blank">View All Photos</a>
</p>

<div>
<p>';
}
# Nope, tell them they have none
else
{
$html .= 'You don\'t have any photos. <a href="upload.php" target="_blank">Upload photos now!</a>';
}
$vbulletin->db->free_result($getphotos);

$html .= '</p>
</div>';
return $html;
}

function update($content)
{
return $content;
}
function edit()
{
$content = $this->content;
if($content['max_pics'] AND $content['max_pics'] < $this->max_images)
{
$limit = htmlspecialchars($content['max_pics']);
}
else
{
$limit = $this->max_images;
}
$html .= '<div class="pmain1">';

# Disable description checkbox
$html .= 'Disable image details? ';
$html .= '<input type="checkbox" name="mod[content][details]" ' . ($content['details'] ? 'checked="checked"': '') . ' /> <br />';
# Max pictures textbox
$html .= 'Max pictures to display ';
$html .= '<input type="text" name="mod[content][max_pics]" value="' . $limit . '" size="5" /> ';
$html .= '<span style="font-size: 7pt; color: #848484;">(max ' . $this->max_images . ' allowed)</span> ';

$html .= '</div>';

return $html;
}
}

i have spent about 45min reading through alot of Iframe related threads but none of them have helped my problem.

I have a website with iframes, on my index page i am trying to put an iframe into the content box so when you click the links up top it will load them without refreshing the whole page.

So thats fine i put in my iframe code like this

<iframe name="homeframe" width="780" height="250" border="0" frameborder="0" marginheight="0" padding="0" marginwidth="0" scrolling="auto"src="homeframe.html">
</iframe>

And on the html document im trying to put into it "homeframe.html" it open up but it scrolls horizontally not vertically and all the writing goes onto 1 line horizontally. The width of my content box is 780px so i made the table in the homeframe.html document 780 so it wouldnt have the bar but it does.

im stumped. thanks in advance.

I'm trying to remove the horizontal scroll bar from a div but keep the vertical. I've seen a lot of posts on this but the answer is always:
overflow-y:scroll;overflow-x:hidden
but that won't work for me, because the x width does exceed the page, so I don't want to hide, I want to rely on the page's native horizontal scroll bars.
(The reason being, I have a 'fixed/frozen' header div above which the offending div needs to stay in sync with)

Hi,

I've a frameset which contains two rows:

<frameset rows="40%,60%" frameborder="10" ImagesBaseUrl="images/" CssClass="VerticalSplitterBar" scrolling="yes">
<frame src="ProgramReport1.aspx" frameborder="10" MARGINWIDTH="5px" scrolling="yes">
<frame src="BottomFrame.aspx" frameborder="10" >
</frameset>

The first page(ProgramReport1) width size is larger than the normal window size:



<body>
<ComponentArt:TabStrip id="TabStrip1"
<ComponentArt:MultiPage id="MultiPage1"
<ComponentArtageView ID="PageView1"
<div style="vertical-align:middle; height: 552px; overflow: auto; overflow: auto; width:1400px; padding-left: 5px; padding-right: 5px;">


While displaying the frameset the vertical scroll bar is there, but there is no horizontal scroll bar.
I've enabled scrolling="yes" to the frame, but still the horizontal scroll bar is not displayed.

Do I need to handle any other properties.

Thanks for your time,
Senthil

New poster here! Recently been creating a website using HTML & CSS from scratch using Notepad++. I was under the impression that the more flat, or spread out the design, browsers would squish it automatically to fit on the page. Apparently this is not the case.

I current have a page where the main content starts 250 pixels from the left hand side of the screen, this causes some of the content disappear of the right hand side of on lower resolution screens. Should I be starting the content at the far left, or is there another web page design convention I should be following?

I assume there is a way around this however I can't seem to find it! Any help would be greatly appreciated. These forums are a wealth of knowledge!

OK - I want you you to know, I don't know what I'm doing. But I'm trying to build my web site and I'm just about there but am having one problem.

The problem page is he

http://www.danielrubio.com/clientlogin.html

and he

http://www.danielrubio.com/listeningroom.html

I can't get the navigation area on the left to occupy the same vertical position as the login form. With the second page I can't get the navigation area on the left to occupy the same vertical position as the links to my MP3's. The reason I set things up this way to start with was to keep the form and the links centered on the page no matter what size window or screen resolution.

Here is the code for the first problem page:

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
  <script language="JavaScript">
function Login(){
var done=0;
var username=document.login.username.value;
username=username.toLowerCase();
var password=document.login.password.value;
password=password.toLowerCase();
if (username=="luckydog" && password=="sunshine") { window.location="http://www.danielrubio.com/heidi/juliexyz.html"; done=1; }
<!-- The user above is Julie Rubio 070216 -->
if (username=="bighands" && password=="hardwork") { window.location="http://www.danielrubio.com/guest/12345678.html"; done=1; }
<!-- The user above is Guest 070216 -->
if (username=="member1" && password=="password1") { window.location="page1.html"; done=1; }
if (username=="member2" && password=="password2") { window.location="page2.html"; done=1; }
if (username=="member3" && password=="password3") { window.location="page3.html"; done=1; }
if (done==0) { alert("Invalid login!"); }
}
// End -->
  </script>
  <meta http-equiv="content-type"
 content="text/html; charset=ISO-8859-1">
  <meta name="keywords"
 content="daniel rubio, composer, orchestrator, tuba, new orleans, last days, derringer, sidewalk, second line, music, bmi, garritan, dixieland, theater, jazz, bourbon, imdb">
  <meta name="robots" content="index, follow, noarchive">
  <meta name="description"
 content="Daniel Rubio is a composer and orchestrator for theater film and television from New Orleans and a tuba player">
  <title>DANIEL RUBIO</title>
</head>
<body
 style="color: rgb(0, 0, 0); background-color: rgb(192, 192, 192); height: 646px;"
 alink="#000099" link="#000099" vlink="#990099">
<table
 style="text-align: left; font-family: Helvetica,Arial,sans-serif; background-color: transparent; width: 100%; height: 100%;"
 border="0" cellpadding="2" cellspacing="2">
  <tbody>
    <tr>
      <td colspan="2" rowspan="1"
 style="text-align: center; width: 100%; height: 96px;"><big><big><big><span
 style="font-weight: bold;"> </span></big></big></big>
      <h1 style="font-weight: bold; height: 25px;">D <small>A
N I E L</small> &nbsp; R <small>U B I O</small></h1>
      <big><big><big><small><small>Composer
&nbsp;| &nbsp;Orchestrator</small></small></big></big></big></td>
    </tr>
    <tr>
      <td colspan="2" rowspan="1"
 style="width: 100%; height: 108px;"> <big><big><big><img
 style="position: absolute; width: 108px; height: 144px; top: 57px; left: 96px;"
 alt="Photograph of Daniel Rubio"
 src="../../photogs/DanBW45a.jpg"></big></big></big><font
 size="+1"> </font>
      <div style="text-align: center; margin-top: 0px; height: 92px;"><font
 size="+1"><span style="color: rgb(51, 51, 51);"></span></font><big><span
 style="color: rgb(51, 51, 51);"><big><small><small><small><br>
      <br>
      <big><big><big>C</big>LIENT <big>L</big>OGIN<br>
      <br>
      <br>
      <br>
      <br>
      </big></big></small></small></small></big></span></big><big><span
 style="color: rgb(51, 51, 51);"><big><small><small><small><big><big>
      <center>
      <form name="login">
        <table style="width: 225px;" border="1"
 cellpadding="3">
          <tbody>
            <tr>
              <td colspan="2"> <br>
              <div ="">
              <center><font size="+2"><b>Welcome!</b></font></center>
              </div>
              </td>
            </tr>
            <tr>
              <td>Username:</td>
              <td><br>
              <div style="z-index: 2;"><input
 name="username" type="text"></div>
              </td>
            </tr>
            <tr>
              <td>Password:</td>
              <td><input name="password" type="text"></td>
            </tr>
            <tr>
              <td colspan="2" align="center"><input
 value="Login!" onclick="Login()" type="button"></td>
            </tr>
          </tbody>
        </table>
      </form>
      </center>
      </big></big></small></small></small></big></span></big></div>
      </td>
    </tr>
    <tr style="color: rgb(51, 0, 153);">
      <td
 style="vertical-align: top; text-align: center; width: 20%; background-color: rgb(153, 153, 153); height: 337px;"><small><big><big>&nbsp;
      </big></big><br>
      <a href="http://www.danielrubio.com/index.html">Home</a><br>
      <br>
      <a href="http://www.danielrubio.com/clientlogin.html">Client
Login</a><br>
      <br>
      <a href="http://www.danielrubio.com/listeningroom.html">Listening
Room</a><br>
      <br>
      <a href="http://www.danielrubio.com/biography.html">Biography</a><br>
      <br>
      <a href="http://www.danielrubio.com/news.html">News</a><br>
      <br>
      <a href="http://www.danielrubio.com/links.html">Links</a><br>
      <br>
      <a href="http://www.danielrubio.com/sitemap.html">Site
Map</a><br>
      <br>
      <a href="http://www.danielrubio.com/feedback.html">Feedback</a></small></td>
      <td style="text-align: center; width: 80%; height: 337px;"><br>
      <div style="position: absolute; left: 240px; top: 377px;"><span
 style="font-weight: bold;"><span
 style="color: rgb(0, 0, 0);"></span> </span><br>
      <span style="font-weight: bold;"></span></div>
      </td>
    </tr>
    <tr>
      <td colspan="2" rowspan="1"
 style="text-align: center; width: 100%; background-color: rgb(153, 153, 153); height: 96px;"><span
 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">Copyright
&copy; 2006 - </span><span
 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">2007
by&nbsp;</span><a
 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;"
 href="http://www.danielrubio.com/feedback.html">Daniel Rubio</a><span
 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">.
&nbsp;All worldwide rights reserved.</span><br
 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">
      <span
 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;">Second
Line Music&trade; is a trademark of Daniel Rubio.</span><span
 style="font-family: Helvetica,Arial,sans-serif; font-weight: bold;"><br>
      </span></td>
    </tr>
  </tbody>
</table>
<span style="font-family: Helvetica,Arial,sans-serif;">&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;
&nbsp;&nbsp;&nbsp;
&nbsp;
</span>
</body>
</html>

I think that if you help me to understand the correct approach to the first page, I can then apply it to the second page.

Thanks for any help,
Dan

Hi, I recently taught my self HTML and CSS so i'm still a bit shaky i started making a website to practice. i made a website with a top nav bar and a side nav bar. i can't seem to get my text to sit in the corner of both like in most websites it just seems to sit in the middle of the vertical side bar here is my HTML code and CSS code

HTML Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Testing... 1 2 3</title>
<link rel="stylesheet" type"text/css" href="CSS1.css" />
</head>
<body>
<h1> Testing Website </h1>
<ul id="nav-list">
<li><A href=Home>Home</A></li>
<li><A href=HTML>HTML</A></li>
<li><A href=CSS>CSS</A></li>
<li><A href=JavaScript>JavaScript</A></li>
<li><A href=XML>XML</A></li>
<li><A href=PHP>PHP</A></li>
<li><A href=SQL>SQL</A></li>
</ul>
<ul id="side-bar">
<li><b>HTML Intro</b></li>
<li><A href=SQL>HTML Home</A></li>
<li><A href=SQL>Intro</A></li>
<li><A href=SQL>Getting Started</A></li>
<li><b>Basics</b></li>
<li><A href=SQL>Basics</A></li>
<li><A href=SQL>Elements</A></li>
<li><a href=SQL>Attributes</a></li>
</ul>
<p> lets have a look </p>
</body>
</html>

HTML Code:

@charset "utf-8";
/* CSS Document */

body {
	background-color:black;
	color:white;
	font-family: Arial, Helvetica, sans-serif;
}
h1 {
	text-align:center;
}
ul#nav-list {
	list-style: none;
	margin: 0;
	padding: 0;
	width: 750px;
	height: 20px;
}
ul#nav-list li {
	display:inline;
}
ul#nav-list li a {
	text-decoration:none;
	padding:5px 0;
	width:100px;
	background: #999;
	color:#fff;
	float:left;
	text-align:center;
	border-left:1px solid #000;
}
ul#nav-list li a:hover {
	background-color:#666;
}
ul#side-bar {
	list-style: none;
	margin:0;
	padding:0;
	width: 100px;
}
ul#side-bar li a {
	text-decoration:none;
	padding:5px 5px;
	background:#999;
	color:#FFF;
	float:left;
	width: 90px;
	text-align: center;
	margin-right: 20px;
}
ul#side-bar li a:hover {
	background:#666;
}
p {
	color:#FFF;
}

Good day,

I am brand new here in this forum. So many knowledgeable folks here.

I am relatively new to web design. I typically use templates and themes and tweak them. I can navigate a CSS doc and html to make changes, etc. However, I have a client who has an existing site that she wants to keep the aesthetic of and so I am using what the previous designer left. It is a simple html page with tables. Simple enough. Very elegant visually. No need to SEO really so it works.

She has asked if we can make the left column of a two column table scroll independently. The page content is about over 6000px. The scroll column will contain a page outline and other text that will include internal targeted links. This is outside my skill set, but I want to learn. Have searched the net and found some suggestions but want it to be clean and ended up here.

There is no style sheet other than the ie6 sheet.

Page is he http://www.themedeaproject.com/proposaltestpage.html no graphics are loaded.

Can anyone point me to a good tutorial or have any suggestions?

Thanks!

BlueEyedMonkey aka Tatyanna

Hello all,
The team I work on is going to be creating a .NET application which reads organization information from a database and creates a dynamic Org Chart.

One of common features in an org chart is lines that show reporting structures.
Does anyone have any recommendations on how we could dynamically create such lines that would need to go both horizontally and vertically?
Thanks

Some mouses today have horizontal scroll, some call the tilt.
It looks something like:
http://www.htmlforums.com/attachment...1&d=1242556560

I noticed that many websites they code those horizontal scroll to go to next/prevous page. For example Discuz! forum system has this function. While you browse hundreds or thousands of posts separated into pages, the horizontal scroll can take you to previous page or next page.(not browser back/forward)

How do I code like that? Or any examples?