Scrolling Text in Tables

Discussion in 'Web Design and Development' started by jdl8422, Aug 21, 2007.

  1. jdl8422 macrumors 6502

    jdl8422

    Joined:
    Jul 5, 2006
    Location:
    Louisiana
    #1
    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.
     
  2. tominated macrumors 68000

    tominated

    Joined:
    Jul 7, 2006
    Location:
    Queensland, Australia
    #2
    STOP RIGHT THERE!

    if you are using tables to make a layout, you must be stuck in 1999. Never make a layout using tables. Nowdays, XHTML and CSS is the way to go. BTW: If it is for data, then that is ok. just apply the "overflow: auto;" css property.
     
  3. Nermal Moderator

    Nermal

    Staff Member

    Joined:
    Dec 7, 2002
    Location:
    New Zealand
    #3
    Indeed. Put your "navigation" column in a div with float : left; or float : right; and then the "main" column will usually sort itself out.
     
  4. elppa macrumors 68040

    elppa

    Joined:
    Nov 26, 2003
    #4
    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>
    
     
  5. jdl8422 thread starter macrumors 6502

    jdl8422

    Joined:
    Jul 5, 2006
    Location:
    Louisiana
    #5
    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.
     
  6. elppa macrumors 68040

    elppa

    Joined:
    Nov 26, 2003
    #6
    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.
     

Share This Page