CSS Scrollbar ???

This is a discussion on "CSS Scrollbar ???" within the Web Page Design section. This forum, and the thread "CSS Scrollbar ??? are both part of the Design Your Website category.


 Subscribe in a reader

Go Back   Webforumz.com > Main Forums > Design Your Website > Web Page Design

Notices




Reply
 
LinkBack Thread Tools
  #1  
Old May 6th, 2006, 15:43
Junior Member
Join Date: Apr 2006
Age: 28
Posts: 29
Thanks: 0
Thanked 0 Times in 0 Posts
Question CSS Scrollbar ???

I'm trying to getting "scrollbar" ONLY at certain parts of my page & after looking into "overflow" element, I'm yet far from getting success.

I'm getting my inspiration from this website:

http://www.tristarwebdesign.co.uk/te...ity/index.html

I've tried the "overflow:auto" in "contentRight" but am ALSO having Internet Explorer's own BOTH right & bottom scrollbar.

What I also want is the image (left hand side's image in "contentLeft") "Visible all the time" EVEN if someone scrolls down (using the "contentRight" scrollbar, which is the ONLY scrollbar I would like to have).

I also wonder why am I getting "space" on the top edge of the window (i.e. top of the banner), which is LESS on my browser window but its appearing MORE over the Internet, on this website.

This website can be seen on: members.fortunecity.com/dars2525/home.html

Presently, I've simply worked on 3 links: home.html, about.html, contact.html

My CSS file presently is:

Code: Select all
/* CSS Document */

body 
{
    background-color:white;
}

#logo
{
width:100%;
height:120px;
float:none;
text-align:center;
overflow:hidden;
}

#topMenu
{
    font-family:Georgia, "Times New Roman", Times, serif;
    text-align:center;
    width:100%;
    float:right;
    background-color:black;
}

#topMenu ul
{
    list-style: none;
    background-color:red;
    font-size:medium;
    float:none;
    position:relative;
    padding: 0;
}

#topMenu ul li 
{
    display:inline;
    width:130px;
    color:#FF00FF;
    float:left;
    position:relative;
}

#topMenu a
{
    display:block;
    text-decoration:none; 
    font-size:larger;
    color:red; 
}

#topMenu a:hover
{
    color:blue;
    background-color:white;
    text-transform:uppercase;
}

#content
{
width:100%;
height:400px;
overflow:auto;
}

#contentLeft 
{
width:300px;
margin-top:100px;
float:left;
}

#contentRight 
{
width:650px;
border-left:5px thin black;
}

#contentRight h1
{
font-family:Geneva, Arial, Helvetica, sans-serif;
color:blue;
font-size:large;
text-align:justify;
margin:30px;
}

#contentRight p
{
font-family:Verdana, Arial, Helvetica, sans-serif;
color:black;
font-size:medium;
text-align:justify;
margin-left:30px;
margin-top:10px;
}

#content p.first-letter:first-letter
{
    margin-left:20px;
    font-size:xx-large;
}

#content ul
{
    font-family:Verdana, Arial, Helvetica, sans-serif;
    text-align:justify;
    color:black;
    margin-left:50px;
    list-style-image:url(list_icon.gif);
}

#content table
{
font-family:Verdana, Arial, Helvetica, sans-serif;
color:black;
font-size:medium;
margin:30px;
}

#content img.left
{
float:none;
padding:0px;
}

.bold 
{
margin:20px;
font-weight:bold;
}

#bottomMenu
{
border:1px solid red;
height:10px;
background-color:black;
font-family:"Times New Roman", Times, serif;
width:100%;
color:white;
text-align:center;
font-size:medium;
height:20px;
}
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote

  #2  
Old May 10th, 2006, 09:41
Most Reputable Member
Join Date: Apr 2006
Location: Cornwall, UK
Posts: 1,310
Thanks: 0
Thanked 0 Times in 0 Posts
Re: CSS Scrollbar ???

First thing first.

Seperate your JavaScript, CSS and xhtml into individual files.

Validate your code. W3C validator currently showing 32 errors.

The bullet list, in Firefox, disappears off to the right outside what graphically appear to be the intended boundaries of your page, and you have to scroll across to see it.

Get rid of the flashing bullets. Users will find this very irritating.

In IE, whilst the bullet list is more where you intended it to be, the layout is still broken.

It was only when I looked at the site with IE that i saw the image of the three telephonists. This image is nowwhere to be seen in Firefox.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

Tags
css, scrollbar

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Need some help with ScrollBar in AS 3 dgstarr Flash & Multimedia Forum 2 Sep 22nd, 2007 16:30
Scrollbar menaka Web Page Design 3 Oct 2nd, 2006 11:39
Scrollbar help? spartak23 Web Page Design 7 Aug 3rd, 2006 19:03
Scrollbar jaffa Web Page Design 2 Sep 2nd, 2005 00:28


All times are GMT. The time now is 11:15.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42