HTML - How Do I Implement Fixed Ads On A Scrollable Website?

I'm not sure where this should be listed so I'm starting here -
Here's the website I'm working on - www.drscopesnaturalhealthcare.com - I'd like to add a textbox under the image below the "news" lable that has a scroll bar on it so it can have quite a bit of content in it but remain a constant size. I know I could do this with frames, but I don't want to use frames. I think I can do this with CSS, but I'm not sure how. Is there an easier way or can some one point me to the element to use in CSS? Thanks.

cybergrrl

Hi all, I'm quite new to webpage development in HTML & using Dreamweaver 8.0.

I am trying to put a small scrollable window within the main webpage, so that the text inside this scrollable window can be scrolled vertically without having to scroll the main window up & down. The webpage I'm building is an FAQs. An example of what I mean can be found on the following webpage :

http://www.xe.com/ucc/ where the user can scroll vertically to see more currency options.

Please refer to my two screen captures where I've shown the code I used & the screen capture from the browser window. I only want the scrollable window to scroll vertical.

Much thanks in advance for your expert help.

Andrew

I have a Table and I need to have it in some kind of scrollable panel. Is there such a scrollable component?

Thanks...

Hi, I have a div element, that will contain various debug/warning messages from Javascript. If I set it's height to 100%, so to fill the parent element, it overlaps the parent element. How can I automatically set the height, without manually setting the height in pixels?

Many thanks for any suggestions.

Regards

Aaron
HTML Code:

<div style="border-style: solid; border-width: 3px; margin: 0px; padding: 0px; z-index: 1000; position: fixed; top: 252px; left: 582px; width: 494px; height: 202px; background-color: white; display: block;">

<h1 style="width: 100%; height: 20px; font-size: 12px; display: block; border-bottom-width: 2px; border-bottom-style: solid; vertical-align: middle;"><img src="https://127.0.0.1/beer2/i/clear.png" style="cursor: pointer;" alt="clear"/><img src="https://127.0.0.1/beer2/i/min.png" style="cursor: pointer;" alt="Minimise"/> Debug Window</h1>

<div style="overflow: scroll; width: 100%; height: 100%; font-size: 12px; position: static;">
<p>test</p>
<p>test</p>
<p>test</p>
<p>test</p>
<p>test</p>
<p>test</p>
<p>test</p>
<p>test</p>
<p>test</p>
</div>

</div>

Not sure if this is possible or not, but I created a scroll box, which contains a title and then text underneath it. Is there a way to limit the scrollable area, so the title is always fixed at the top of the scroll box and the text scrolls up and disappears just below the title? If its not possible in HTML/CSS, then how else can I do this? Thanks for your help in advance.

aaaaaaaaaaaaaaaaaaaaaaa

On this page: http://www.hindbrain.net/ex10.php

I am experimenting with a 'button' to click on to to to a link. I think that it is working pretty well, but I wanted to see if there is a better way to do it. It seems to sometimes act a little odd when the images first load in the browser. Is there a way to cause them to pre load?

edit: I found a way to add a preload css class, so maybe that works.


html:

<a href="http://www.mozilla.com/firefox/" class="userbutton"></a>

css:

.userbutton {
position: absolute;
right: 50px;
top: 50px;
z-index: 2;
background-color: transparent;
background-image: url(grey2.png);
background-repeat: no-repeat;
border: 0px solid;
width: 70px;
height: 70px;
}

a.userbutton:visited {
background-image: url(green2.png);
}

a.userbutton:hover {
background-image: url(blue2.png);
}


thanks,
William

Despite reading multiple posts on "scrollable" table cells on the forums, I've not yet quite found the answer to my question, so hopefully I can get some feedback from all viewers out there!

I and some friends run a small Catholic arts and crafts website (www.illuminatedink.com) through which we sell products that we create. I've based the page layout on a table instead of frames or iframes. The table has 3 cells in it. The entire top "banner area" of the screen is one cell. Below that on the left we have the naviagation menu cell. The main content that someone is trying to view appears in the remaining lower right cell (also the largest).

This page works great on all the computers at my house (3 of them) and on most other computers as well. I have yet to test this in IE 7.0, but if someone else has that browser, please let me know what happens.

So, what's the problem you ask? That lower right table cell where all the content appears does not work for everyone. I just got another complaint today that no scroll bar appears and the person can only see what's in the top of cell, there is no "scrollability". Here is a sample (with notes made by me in ** NOTE ** format). The notes are of course not in the actual code, I am showing only the code really matters here.

Code:

<BODY STYLE="margin-top: 0px; margin-left: 0px">
  <TABLE CELLPADDING=0 CELLSPACING=0 HEIGHT=590 WIDTH=1000>
    <TR HEIGHT=90>
      <TD WIDTH=1000 COLSPAN=2 STYLE="background-image:url('http://www.illuminatedink.com/images/background/banner.jpg')">
        &nbsp
      </TD>
    </TR>

    <TR HEIGHT=500>
      <TD VALIGN=top WIDTH=200 STYLE="background-image:url('http://www.illuminatedink.com/images/background/menu_bar.jpg');background-repeat:no-repeat">
        <TABLE ALIGN="center" CELLSPACING=0 CELLPADDING=0>
          **Navigation menu on the left side goes here**
        </TABLE>
      </TD>
      
      <TD WIDTH=800 VALIGN="top">
        <DIV STYLE="overflow:auto;height:490px;width:800px;position:absolute;left:200;padding-right:30px; padding-left:0px"><MAP NAME="page_links">
          **All code for the scrollable cell in the lower right goes here**
        </DIV>
      </TD>
    </TR>
  </TABLE>
</BODY>

So, can anyone possibly tell me why this would have a scroll bar in some browers and not in others? Or does anyone have any code changes I could make that may guarantee that they will get a scroll bar in that lower right cell? The complaints that I have received mainly seem to be from Mac users using IE for Mac. But I just had someone who had a brand new Dell with Windows XP Prof. and the most recent IE 6, which is exactly the configuration I run, but didn't get a scroll bar when I did. Ideas? Thank you!

How i create a frame type space( which is scrollable ) similar to seperate window inside a webpage ?

Hi everyone!!

I have a div box that has a fixed position so it is always there when you scroll down a page.... but as I have a long footer, the fixed div box goes over the footer when I scroll to the bottom of the page

what is the best way to scroll a div box within another div box, so the div box is visible and scrolls with the page up to where the footer div starts?

hope that makes sense?

many thanks for you're help.

I have a control on a pop up that i cant seem to get rid of the scroll bars....How do you create a pop up window with no scroll bars I want it to use the scroll bars on the control instead....any help with this issue??

Hello. I need some assistance in figure out how to make a fixed/linkable/image. I used this code here HTML Code:

<body style="background-attachment: fixed; background-repeat: no-repeat;" background="XXX.jpg">

which worked great in keeping its place. Then I added HTML Code:

<a href="http://www.davesite.com/">

before and after but no luck. Im trying to get that link to work for the background too, but its not working out at all. "Sadly no HTML skills whatsoever"

hi guys im after a simple code so that the background on my forum is fixed and only the foreground moves up and down, someone must know iv looked all over the place and cant find how anywhere,someone help please

Cheers

Jacob

Without using an Iframe is it possible to make the header and footer fixed and keep it stable?

I found this site with some ode but it s from years ago and not sure if it is correct way now.

here is a link if it is allowed: http://limpid.nl/lab/css/fixed/header-and-footer

I figure there is a reason I rarely see anything using a fixed header. Im not sure if I have ever seen a functioning website with a fixed scrollable header ever.

My reason for asking is to try and make a site where the navigation stays fixed on top and auction listings will scroll underneath them.

Sorry if the link is inappropriate

CODE:

<!-- IE in quirks mode -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN">
<title>Fixed header and footer</title>
<style type="text/css">
body{
margin:0;
padding:header-<length> 0 footer-<length> 0;
}
div#header{
position:absolute;
top:0;
left:0;
width:100%;
height:header-<length>;
}
div#footer{
position:absolute;
bottom:0;
left:0;
width:100%;
height:footer-<length>;
}
@media screen{
body>div#header{
position:fixed;
}
body>div#footer{
position:fixed;
}
}
* html body{
overflow:hidden;
}
* html div#content{
height:100%;
overflow:auto;
}
</style>
<div id="header"> header </div>
<div id="footer"> footer </div>
<div id="content"> content </div>