Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New Coder
    Join Date
    Nov 2008
    Posts
    27
    Thanks
    4
    Thanked 0 Times in 0 Posts

    Y-Overflow on a div

    Hello I have a question about handling y overflow on a div. I made a web page with a restricted height of 1073px. This is all very good and well for most of my pages however, certain pages require more room. For example, this page. Has a large amount of overflow. I tried adding overflow:scroll; to the css but that didn't seem to work, here is the code that I have:

    Code:
    div#maincont{
    	float:left;
    	background:url(../backgrounds/image/diamond_plate_metal-bg.png);
    	font-size:90%;
    	#font-size:95%;
    	font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
    	color:#FFFF99;
    	width:704px;
    	height:1037px;
    	display:table-column;
    	z-index:0;
    	position:relative;
    }
    This is just the main content portion of my pages. Does anyone know how I can get scroll overflow to work? Thanks in advance.
    Last edited by ParadoxKing; 01-06-2010 at 10:08 PM.

  • #2
    New Coder
    Join Date
    Jul 2008
    Posts
    55
    Thanks
    3
    Thanked 4 Times in 4 Posts
    Try making a seperate CSS value and doing it like this:
    Code:
    div
    {
    width:100px;
    height:100px;
    overflow:scroll;
    }

  • #3
    Regular Coder boogily's Avatar
    Join Date
    Jul 2009
    Posts
    275
    Thanks
    18
    Thanked 4 Times in 4 Posts
    I've had it where overflow:auto; works for me pretty well. You obviously need an overflow in there cause your data will exceed you layer size. You can do what jrp said, maybe change the "px" to "%"? (unless for testing reasons) or add to your mainCont

  • #4
    Senior Coder Arbitrator's Avatar
    Join Date
    Mar 2006
    Location
    Splendora, Texas, United States of America
    Posts
    3,372
    Thanks
    32
    Thanked 286 Times in 280 Posts
    Quote Originally Posted by ParadoxKing View Post
    This is just the main content portion of my pages. Does anyone know how I can get scroll overflow to work? Thanks in advance.
    Your element has display: table-column; only four properties apply to table columns: http://www.w3.org/TR/CSS21/tables.html#columns. Given that, it's pretty obvious why overflow isn't doing anything.

    Elements with this display type are equivalent to the col element from HTML. This element should not contain content (it does, incorrectly, in your document). In practice, this display type is virtually never used since you can almost always use the adjacent sibling combinator (the plus sign) in your selectors to select entire table columns.
    For every complex problem, there is an answer that is clear, simple, and wrong.


  •  

    Tags for this Thread

    Posting Permissions

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