Scrolling Text in Tables

jdl8422

macrumors 6502
Original poster
Jul 5, 2006
491
0
Louisiana
I have a website I am doing. I have a table with two columns. What do I have to do to make one of the columns scroll.
 

Nermal

Moderator
Staff member
Dec 7, 2002
18,691
1,186
New Zealand
Indeed. Put your "navigation" column in a div with float : left; or float : right; and then the "main" column will usually sort itself out.
 

elppa

macrumors 68040
Nov 26, 2003
3,229
106
I have a website I am doing. I have a table with two columns. What do I have to do to make one of the columns scroll.
If this does not make any sense to you please ask, your description is pretty limited.

This is how you can get a fixed height column with scroll bars (if necessary).

HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

	<title> 2 Columns, 1 Scrolls </title>
	<style type="text/css" media="screen">
		#wrapper {
			width: 600px;
			margin: 0 auto;
		}
		
		.column1 {
			float: left;
			width: 250px;
			margin-right: 50px;
		}
		
		.column2 {
			float: left;
			width: 300px;
			overflow: auto;
			height: 400px;
		}
	</style>
	
</head>

<body>

<div id="wrapper">
	<h1>2 Columns, 1 Scrolls</h1>
	
	<div class="column1">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
	</div>
	<div class="column2">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
	</div>
</div>

</body>
</html>
 

jdl8422

macrumors 6502
Original poster
Jul 5, 2006
491
0
Louisiana
I appologize for not being more specific in my question. I am a graphic designer and a specialize in print design. I am trying to teach myself some webdesign. I took a basic class in college but it was pretty much just design in photoshop, slice, and export. I know a little bit of HTML, a little of bit of CSS. I dont know alot about one particular area, but I am trying. Any suggestions on how to learn more about this, or any resources.
 

elppa

macrumors 68040
Nov 26, 2003
3,229
106
I appologize for not being more specific in my question. I am a graphic designer and a specialize in print design. I am trying to teach myself some webdesign. I took a basic class in college but it was pretty much just design in photoshop, slice, and export. I know a little bit of HTML, a little of bit of CSS. I dont know alot about one particular area, but I am trying. Any suggestions on how to learn more about this, or any resources.
That's cool, did my example achieve what you wanted, or was it something else you were after?

For CSS info, there is a mine of information here.