Results 1 to 2 of 2

Thread: Scrollable DIV

  1. #1
    Join Date
    Nov 2013
    Location
    Québec, Canada
    Posts
    18
    Thanks
    7
    Thanked 0 Times in 0 Posts

    Question Scrollable DIV

    I have a .class DIV which contains 2 DIVs. In the right DIV I have some content that need to be scrolled. I just can't find out how to do that. I tried the option "Scroll", "Visible" etc. but really.... can't make it work ! Hope you can help me out guys !

    Here is the CSS:
    Code:
    body{
    	margin: 0;
    	padding: 0;
    	background-image: url(img/back.png);
    }
    			
    			
    #wrapper {
    	width: 100%;
    }
    
    #header {
    	height: 112px;
    	width: 100%;
    	border: 1px solid #A2A2A2;
    	padding: 0px;
    	margin-top: 0px;
    	margin-right: auto;
    	margin-bottom: 0px;
    	margin-left: auto;
    }			
    
    #logo_gauche {
    	float: left;
    	width: 20px;
    	height: 112px;
    	padding-left: 0px;
    	margin-left: 0px;
    }
    #menu {
    	margin-right: auto;
    	margin-left: auto;
    }
    .center {
    	width: 100%;
    	margin-right: auto;
    	margin-left: auto;
    	float: left;
    	position: fixed;
    	height: auto;
    }
    #left {
    	width: 22%;
    	float: left;
    	padding-left: 45px;
    	padding-top: 50px;
    }
    #right {
    	width: 38%;
    	float: left;
    	border:solid;
    	border-width:.9px;
    	border-color:#5D5D5D;
    	-webkit-border-radius: 5px;
    	-moz-border-radius: 5px;
    	border-radius: 5px;
    	margin-top: 10px;
    	background-color: #FFF;
    	padding-top: 20px;
    	padding-right: 5px;
    	padding-bottom: 5px;
    	padding-left: 5px;
    	background-repeat: no-repeat;
    	font-family: Tahoma, Geneva, sans-serif;
    	font-size: .78em;
    	color: #0C4465;
    	text-align: justify;
    	overflow: auto;
    	height: auto;
    }
    
    ul.menu{
    	margin-top: 22px;
    	margin-right: auto;
    	margin-left: auto;
    }
    
    .tftable {
    	font-size:12px;
    	color:#333333;
    	width:100%;
    	border-width: 1px;
    	border-color: #729ea5;
    	border-collapse: collapse;
    }
    .tftable th {font-size:12px;background-color:#acc8cc;border-width: 1px;padding: 8px;border-style: solid;border-color: #729ea5;text-align:left;}
    .tftable tr {background-color:#d4e3e5;}
    .tftable td {
    	font-size:12px;
    	border-width: 1px;
    	padding: 8px;
    	border-style: solid;
    	border-color: #729ea5;
    }
    .tftable tr:hover {background-color:#ffffff;}

    And the HTML:
    Code:
    <div class="center">
    
    <div id="left">
    <img src="img/logo_left.png" align="absmiddle">
    </div>
    
    <div id="right">
    
    <table class="tftable" border="1">
    <tr><th>Descriptions</th><th>Forfait de BASE</th><th>Forfait RÉGULIER</th><th>Forfait de LUXE</th></tr>
    <tr><td>Nb de pages maximum</td><td align="center">4 pages</td><td align="center">8 pages</td><td align="center">16 pages</td></tr>
    <tr><td>Formulaire de contact</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Page Facebook</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Papier-Peint</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Menu Dynamique</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Prise de photos</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Google Map intégrée</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Achat du nom de domaine</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Achat de l'hébergement</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Configuration des courriels</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Mise-à-jour - 1 mois</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td><td align="center"><img src="img/y.png"></td></tr>
    <tr><td>Menu-Onglets maximum</td><td align="center">4 onglets</td><td align="center">6 onglets</td><td align="center">8 onglets</td></tr>
    <tr><td>Animation (Intro)</td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/x.png"></td><td align="center"><img src="img/y.png"></td></tr>
    </table>           
    
    </div>
    Thank you very much !!!
    Last edited by drcolt45; 02-19-2014 at 11:35 PM. Reason: Formatting

  2. #2
    Join Date
    Jul 2008
    Location
    Derbyshire, UK
    Posts
    1,933
    Thanks
    16
    Thanked 303 Times in 302 Posts
    Blog Entries
    9

    Default

    "Scroll" and "visible" aren't css properties - but overflow is http://www.w3schools.com/cssref/pr_pos_overflow.asp
    Focus on Function Web Design | Latest News RSS | Facebook | Twitter |
    Fast Edit (A flat file, PHP web page editor & CMS. Small, FREE, no database!) | Fast Edit BE (Snippet Manager) (Web content editor for multiple editable regions!) | Fast Apps |
    The only limit to creativity is imagination: JemCon.org

  3. The Following User Says Thank You to Beverleyh For This Useful Post:

    drcolt45 (02-19-2014)

Similar Threads

  1. Replies: 5
    Last Post: 04-11-2013, 05:46 AM
  2. Replies: 9
    Last Post: 04-02-2007, 12:35 AM
  3. Replies: 22
    Last Post: 11-17-2006, 10:36 PM
  4. Replies: 1
    Last Post: 10-17-2006, 06:47 AM
  5. Scrollable content II
    By leahmarie in forum Dynamic Drive scripts help
    Replies: 0
    Last Post: 04-16-2006, 11:10 PM

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •