scrolling div challenge leading to mental meltdown

hi there,

i'm having a difficult time inserting a scrolling div into a table. i'm a graphic designer and want to use the scrolling div on the portfolio page of my site.
i find that everything i've tried breaks up the table?! can anyone help! i'm starting to lose my marbles.

the scrolling div needs to go into the large white area (to the right of the nav bar).

here's the code.

Expand|Select|Wrap|Line Numbers

 
<html>

<head>

<title>Orbit-creative WEB Layout 04</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link href="styles.css" rel="stylesheet" type="text/css">

<style type="text/css">

<!--

-->

</style>

</head>

<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">

<!-- ImageReady Slices (Orbit-creative WEB Layout 04.psd) -->

<table width="700" height="538" border="0" align="center" cellpadding="0" cellspacing="0" id="layouttable">

<tr>

        <td colspan="5">

    <img alt="" width="700" height="60" style="background-color: #009900"></td>

  </tr>

    <tr>

        <td colspan="3">

      <img alt="" width="269" height="129" style="background-color: #009900"></td>

      <td width="373" height="424" rowspan="2" id="tdwhite"><br />
 
      <p>&nbsp;</p></td><td rowspan="2">

      <img alt="" width="58" height="424" style="background-color: #009900"></td>

  </tr>

    <tr>

        <td>

      <img alt="" width="55" height="295" style="background-color: #009900"></td>

      <td width="158" height="295" id="tdnavbar"><p align="center"><a href="#">ABOUT US</a></p>

          <p align="center"><a href="#">PORTFOLIO</a></p>

        <p align="center"><a href="#">TESTIMONIALS</a></p>

        <p align="center"><a href="#">USEFUL LINKS</a></p>

      <p align="center"><a href="#">CONTACT</a></p></td>

<td>

      <img alt="" width="56" height="295" style="background-color: #009900"></td>

  </tr>

    <tr>

        <td colspan="5">

      <img alt="" width="700" height="54" style="background-color: #009900"></td>

  </tr>

</table>

<br>

<div id="divcopyright">

  <div align="center">&copy;2008 orbit creative</div>

</div>

<!-- End ImageReady Slices -->

</body>

</html>

i'm a photoshop veteran but a dreamweaver newbie. any help is greatly appreciated!

thanks,
Rob

Mar 4 '08 #1

Subscribe Post Reply

1478

drhowarddrfine

7,435

Expert 4TB

As a graphics designer, you should learn to use CSS and not tables for layout. You will appreciate the flexibility compared to the rigidity of tables. I'll show you an example when I have time.

Your page needs a doctype to keep Internet Explorer out of the 1990s. Put this at the top of your page:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Depending on the version of DW you have, and I notice you used ImageRead, too, it may lean toward IE and tables for layout. Both are bad things but I'll have a look. Like I said above, I'll try and find time to show you a table-less version of the same thing.

Mar 4 '08 #2

drhowarddrfine

7,435

Expert 4TB

Through the power of CSS ;) I easily changed this to something I think you are looking for. Notice the only thing I added was inside the <p> in this, plus removing the <br>:
[HTML]<td width="373" height="424" rowspan="2" id="tdwhite">
<p style="background-color:#ddd;height:100%;margin:0;overflow:scroll">& nbsp;a</p>
</td>[/HTML]

Check back in a bit and, hopefully, I will redo the page and show you how it's done using CSS and no tables.

Mar 4 '08 #3

drhowarddrfine

7,435

Expert 4TB

This isn't exactly what you had but it's close and it's just to make a point.
[HTML]<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Orbit-creative WEB Layout 04</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style type="text/css">
* {margin:0}
body { height:100%;width:700px;margin:0 auto }
#banner { height:60px;background-color:#090 }
#scrolling { height:100% }
#scrolling img { width:269px;height:129px;float:left }
#scrolling p { height:400px;overflow:scroll }
#left-side { float:left }
#nav { position:relative;top:2em;list-style-type:none }
</style>
</head>
<body>

<div id="banner"></div>

<div id="left-side">
<img src="1.png" alt="">
<ul id="nav">
<li><a href="#">About Us</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Testimonials</a></li>
<li><a href="#">Useful Links</a></li>
<li><a href="#">Useful Links</a></li>
</ul>
</div>

<div id="scrolling">
<p>
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque eu tellus.
Vestibulum suscipit felis sit amet nibh. Etiam malesuada ornare ante. Proin nec lacus.
Donec ipsum lectus, sodales ac, volutpat at, congue sit amet, diam. Quisque porttitor
lorem. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Curabitur hendrerit
nonummy erat. Donec scelerisque varius orci. Donec tortor ligula, congue nec, luctus
a, condimentum eu, tellus. Vivamus posuere. Quisque semper dictum orci. Aenean et
ipsum non tortor condimentum molestie. Sed sit amet nulla. Praesent quam eros,
dignissim a, pellentesque nec, laoreet sed, urna. Aliquam pulvinar iaculis elit. Donec
placerat neque non sem. Donec nisi. Nulla ut elit.
</p>
</div>

</body>
</html>[/HTML]

Mar 4 '08 #4

by: pythonchallenge | last post by:

For the riddles' lovers among you, you are most invited to take part in the Python Challenge, the first python programming riddle on the net. You are invited to take part in it at:...

Python

Absolute Pathing Challenge

by: Stuart | last post by:

Hi All, I got a challenge to make the same APS/Script/Html run on different web roots. I can not use relative pathing in a lot of cases. We use lots of included files so depending on where that...

ASP / Active Server Pages

scrolling issue. pleeeezzzz help...

by: Mel | last post by:

i have the following code and need to scroll the div to the bottom on each of the inserts. please help *&^%$#@ <a href=# onclick="addtext('Wed Mar 23 11:23:58 AM Eastern Standard Time...

Javascript

DB2 join challenge

by: redeck | last post by:

I have table A with 2 columns: PK and Txt , size - 1000 rows. Also, I have table B with 100000 rows and 100 integer columns, each one is a foreign key to A's PK. I need to create a view in which...

DB2 Database

Mental Abuse

by: khaccountant | last post by:

My abuser has been using the medical device to harass me the last 4-5 years. I have no idea what type of a device is being used on me. I believe the device is only available to licensed...

C / C++

repost:scrolling tables

by: Jon Paal | last post by:

trying to use this script for scrolling tables found at this link: http://www.litotes.demon.co.uk/example_scripts/tableScroll.html The top left corner in the table grid is hidden from being...

Javascript

small challenge : limit((x+1)**0.5 for x in itially(2))

by: Azolex | last post by:

generators challenge -------------------- define "limit" and "itially" so that limit(foo(x) for x in itially(bar)) works out the same as

Python

VB vs. C# language challenge question

by: Tomasz Jastrzebski | last post by:

Hello, Below there are two equivalent(?) pieces of C# and VB.Net code. While the C# version compiles with no warning, the VB.Net version does not compile due to the compiler error BC30149: Class...

Visual Basic .NET

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

How to build RAID in BIOS?

by: Hystou | last post by:

There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...

Computer Hardware

What is ONU?

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,...

General

Changing the language in Windows 10

by: Hystou | last post by:

Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...

Windows Server

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

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...

Online Marketing

The easy way to turn off automatic updates for Windows 10/11

by: Hystou | last post by:

Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows...

Windows Server

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

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...

General

Couldn’t get equations in html when convert word .docx file to html file in C#.

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...

C# / C Sharp

scrolling div challenge leading to mental meltdown

Similar topics