CSS: Problem with 'overflow=auto'

Author Message

Maarten Holland

Thursday 15 April 2004 6:51:23 am

I want to make a part of my page srollable. Therefore I've placed the content of that part in between <div id=scrollcontent> Content here </div>.

In my CSS I've defined scrollcontent as follows:

#scrollcontent
{
width: 735;
height: 430;
background-color: #FFFFFF;
overflow: auto;
}

This gives some problems with other DIV's that I use in my override templates. Some backgroundcolors don't show up, until you move your mouse over them. Some parts that I select with my mouse, stay selected while I select another part and so on.

Does anyone know what can be causing this?

Thank you for your time,

Maarten

Alex Jones

Thursday 15 April 2004 8:00:11 am

Maarten, what browser(s) are these problems showing up in? Can you post the URL of this page? Solving CSS issues tend to require looking at the actual page to find a solution.

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Maarten Holland

Thursday 15 April 2004 11:50:06 am

Unfortunately I can&acute;t post an URL because it&acute;s not on a productionserver yet.

Problem is showing up in IE 6 on Windows. It seems to have something to do with pagelayout.tpl. When I put the DIV in that template (around module.result.content) the problems appears. When I put the DIV around the code in the overridetemplate, the problem dissapears.

Alex Jones

Friday 16 April 2004 6:35:38 am

Hrrrm, it sounds like a cascade problem. Can you cut and paste the following bits of code please?
1. The CSS used to style the page
2. The code output to the browser when you place the div in pagelayout.tpl
3. The code output to the browser when using the override template

This will help tremendously.

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Maarten Holland

Thursday 29 April 2004 12:40:44 am

Hi Alex,

A copy of the site can be visited at example.ezstart.nl. At some pages, the problem also appears when I put the DIV in the override. This happens at the loginpage for example. Strange enough, some other pages don't have this problem when I put the DIV in the override.

I hope you can find the problem. Thank you for your help.

Cheers,

Maarten

Alex Jones

Thursday 29 April 2004 6:45:13 am

Maarten, while I can see the site, I don't have a login, so I cannot see a page that should overflow. Would it be possible to provide a guest login? If you don't want to provide it to the world, you can e-mail me at <i>- removed by Alex -</i>.

A couple of quick notes. IE is known for having issues with <i>overflow: auto</i>. This is due in large part to other elements not having heights set to them as well. You may want to experiment with applying a height via CSS to <i>div#boxgroot-body</i>. Also, I think your debugging efforts are harder as you are mixing table based layouts with CSS based layouts. This makes calculating heights and widths much harder as you have to account for the values in your various table tags alongside the values in your stylesheets. This is complicated even further by the differences in the way each browser interprests the box model (for example the padding value may be added to the total width, or it may be taken as part of the specified width). All in all it gets quite confusing. :(

Hopefully we can figure this out and get you going!

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Alex Jones

Thursday 29 April 2004 6:55:37 am

Also, you should include a Doctype to ensure your site is rendered properly. IE 6 has a strict mode and a quirks mode. Quirks mode provides support for code developed for earlier versions of IE. Some resources:

Fix Your Site With the Right DOCTYPE!: http://www.alistapart.com/articles/doctype/
Quirksmode: http://www.quirksmode.org/
Activating the Right Layout Mode Using the Doctype Declaration: http://www.hut.fi/u/hsivonen/doctype.html

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Maarten Holland

Thursday 29 April 2004 7:15:47 am

Alex,

I've tried to sent you an e-mail with my reply, but the address seems to be incorrect. Could you check it or mail me at maarten [at] ezstart [dot] nl?

Alex Jones

Thursday 29 April 2004 8:26:55 am

Ooops, I made a mistake in my e-mail address, sending the first part of my home address with the latter part of my work address. Duh! Sorry about that. I have sent you an e-mail.

Alex

Alex
[ bald_technologist on the IRC channel (irc.freenode.net): #eZpublish ]

<i>When in doubt, clear the cache.</i>

Powered by eZ Publish™ CMS Open Source Web Content Management. Copyright © 1999-2014 eZ Systems AS (except where otherwise noted). All rights reserved.

eZ debug

Timing: Jan 19 2025 01:12:59
Script start
Timing: Jan 19 2025 01:12:59
Module start 'layout'
Timing: Jan 19 2025 01:12:59
Module start 'content'
Timing: Jan 19 2025 01:13:00
Module end 'content'
Timing: Jan 19 2025 01:13:00
Script end

Main resources:

Total runtime0.6752 sec
Peak memory usage4,096.0000 KB
Database Queries75

Timing points:

CheckpointStart (sec)Duration (sec)Memory at start (KB)Memory used (KB)
Script start 0.00000.0058 589.1563152.6250
Module start 'layout' 0.00580.0029 741.781339.4609
Module start 'content' 0.00870.6649 781.2422604.2031
Module end 'content' 0.67360.0016 1,385.445320.1563
Script end 0.6752  1,405.6016 

Time accumulators:

 Accumulator Duration (sec) Duration (%) Count Average (sec)
Ini load
Load cache0.00320.4748160.0002
Check MTime0.00140.2042160.0001
Mysql Total
Database connection0.00090.139210.0009
Mysqli_queries0.602089.1520750.0080
Looping result0.00070.1006730.0000
Template Total0.646595.720.3232
Template load0.00190.284220.0010
Template processing0.644695.459420.3223
Template load and register function0.00020.026110.0002
states
state_id_array0.00080.117910.0008
state_identifier_array0.00090.127120.0004
Override
Cache load0.00170.2547570.0000
Sytem overhead
Fetch class attribute can translate value0.00070.106420.0004
Fetch class attribute name0.00120.1800100.0001
XML
Image XML parsing0.00070.099420.0003
class_abstraction
Instantiating content class attribute0.00000.0048140.0000
General
dbfile0.00080.1252160.0001
String conversion0.00000.001040.0000
Note: percentages do not add up to 100% because some accumulators overlap

Templates used to render the page:

UsageRequested templateTemplateTemplate loadedEditOverride
1node/view/full.tplfull/forum_topic.tplextension/sevenx/design/simple/override/templates/full/forum_topic.tplEdit templateOverride template
9content/datatype/view/ezxmltext.tpl<No override>extension/community_design/design/suncana/templates/content/datatype/view/ezxmltext.tplEdit templateOverride template
11content/datatype/view/ezxmltags/paragraph.tpl<No override>extension/ezwebin/design/ezwebin/templates/content/datatype/view/ezxmltags/paragraph.tplEdit templateOverride template
3content/datatype/view/ezxmltags/line.tpl<No override>design/standard/templates/content/datatype/view/ezxmltags/line.tplEdit templateOverride template
5content/datatype/view/ezimage.tpl<No override>extension/sevenx/design/simple/templates/content/datatype/view/ezimage.tplEdit templateOverride template
1print_pagelayout.tpl<No override>extension/community/design/community/templates/print_pagelayout.tplEdit templateOverride template
 Number of times templates used: 30
 Number of unique templates used: 6

Time used to render debug report: 0.0002 secs