emacs-orgmode
[Top][All Lists]
Advanced

[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]

Re: [Orgmode] Suggestions for Orgmode.org homepage


From: Sebastian Rose
Subject: Re: [Orgmode] Suggestions for Orgmode.org homepage
Date: Thu, 08 Jan 2009 03:53:31 +0100
User-agent: Gnus/5.13 (Gnus v5.13) Emacs/23.0.60 (gnu/linux)

Hi Manish,

just make the #table-of-contents limited to a certain height. 100%
should work if nothing else is higher than the visible area in the
browser. If it doesn't, use a pixel value.

 @media screen {

 /* ... all your styles here ... */

 #table-of-contents
 {
  position:fixed;
  width:198px;
  /* add this for the height: */
  height:100%;
  overflow:auto;
 }

 * html { overflow-y: hidden; }

 * html body {
  overflow-y: auto;
  height: 100%;
  padding: 0 0 0 0;
  font-size: 100%;
 }

 * html div#table-of-contents { position: absolute; }
 }


Regards,

   Sebastian

Manish <address@hidden> writes:
>   > Manish <address@hidden> writes:
>   >> Hello Carsten,
>   >>
>   >> The image at http://imagebin.org/35260 shows the Orgmode homepage in
>   >> IE6 and http://imagebin.org/35261 shows the the same page in FF3. The
>   >> page in IE (6) is jumbled up (table of contents mixed up with page
>   >> contents) since it (IE6) does not support "position: fixed" used in
>   >> the org.css. I faced the same issue when I gave some org-generated
>   >> HTML documentation to someone using IE yesterday. So I got some help
>   >> from a friend and worked out a compromise so that it doesn't break so
>   >> horribly in IE6.
>   >>
>   >> What I did was to create another small CSS file, org-ie6, css,
> with following
>   >> contents:
>   >>
>   >>  : #table-of-contents{
>   >>  :   position: absolute;
>   >>  :   float: left;
>   >>  : }
>   >>  :
>   >>  : body {
>   >>  : background-attachment: scroll;
>   >>  : }
>   >>
>   >> And load this CSS conditionally when IE 6 is being used by adding
>   >> following line in the generated HTML file's header just above the
>   >> <body> tag:
>   >>
>   >>  : <!--[if lt IE 7]><link rel="stylesheet" href="org-ie6.css"
>   >> type="text/css" ><![endif]-->
>   >>
>   >> (previous line may wrap)
>   >>
>   >> The compromise is that the table of contents in the sidebar (along
>   >> with the background image) scrolls up with the page unlike in FF,
>   >> which IMHO, is an acceptable compromise. I have been told that some
>   >> javascript magic can make IE6 behave like "position: fixed" but I
>   >> haven't yet worked out how/if that can be done.
>   >>
>   >> Possibly a better workaround/solution exists for this else please
>   >> consider making similar change to the Orgmode home page.
>   >>
>   >> Also, I do not have access to IE7 so I do not know if that works.
>
> On Thu, Jan 8, 2009 at 1:15 AM, Sebastian Rose wrote:
>>
>> This is what I use in such cases. All styles starting with '*' are read
>> by IE only. No compromise should be neccessary.
>>
>>
>>
>>
>> @media screen {
>>
>> /* ... all your styles here ... */
>>
>> #table-of-contents
>> {
>>  position:fixed;
>>  width:198px;
>> }
>>
>> * html { overflow-y: hidden; }
>>
>> * html body {
>>  overflow-y: auto;
>>  height: 100%;
>>  padding: 0 0 0 0;
>>  font-size: 100%;
>> }
>>
>> * html div#table-of-contents { position: absolute; }
>> }
>
> This is a much better solution.  I have an on/off-topic question
> though, if you do not mind.  In case the TOC contents are more than
> what fits on the page what do I add to css (or may be to #+OPTIONS
> line?) to bring up a scroll bar like in
> http://orgmode.org/Changes.html?
>
> Regards,

-- 
Sebastian Rose, EMMA STIL - mediendesign, Niemeyerstr.6, 30449 Hannover
Tel.:  +49 (0)511 - 36 58 472
Fax:   +49 (0)1805 - 233633 - 11044
mobil: +49 (0)173 - 83 93 417
Email: address@hidden, address@hidden
Http:  www.emma-stil.de




reply via email to

[Prev in Thread] Current Thread [Next in Thread]