Scaling to the full screen width

Previous Topic Next Topic
 
classic Classic list List threaded Threaded
4 messages Options
Reply | Threaded
Open this post in threaded view
|

Scaling to the full screen width

wimalopaan
Hi all,

maybe a very dumb question: if I use the html-output-file on a very wide screen (say 1900px) it scales not to the full width.
Is there an attribute for setting the max-width? Looked at the css, but didn't find it ...

--
Wilhelm
Ted
Reply | Threaded
Open this post in threaded view
|

Re: Scaling to the full screen width

Ted
If you view source in the HTML that Asciidoctor generates

You'll find in the HEAD
<style>
/* Asciidoctor default stylesheet...
...
#header,#content,#footnotes,#footer{width:100%;margin-left:auto;margin-right:auto;margin-top:0;margin-bottom:0;max-width:62.5em;*zoom:1;position:relative;padding-left:.9375em;padding-right:.9375em}

Comment out this
/*max-width:62.5em;*/


That will remove the restriction and make your content full width
- Ted @TedAtCIS
Reply | Threaded
Open this post in threaded view
|

Re: Scaling to the full screen width

wimalopaan
That's it,

thank you!
Reply | Threaded
Open this post in threaded view
|

Re: Scaling to the full screen width

mojavelinux
Administrator
In reply to this post by wimalopaan

On Tue, Apr 14, 2015 at 1:13 AM, wimalopaan [via Asciidoctor :: Discussion] <[hidden email]> wrote:
Is there an attribute for setting the max-width?

Actually, yes. If you set the `max-width` attribute, it will be become the max-width style on the body element. You can see the assignment here:


Unfortunately, the default Asciidoctor stylesheet applies the max-width on the content too, as Ted points out. So, in the end, you'll have to modify the stylesheet (or add CSS via docinfo to override).

Cheers,

-Dan

p.s. This might make a good FAQ for the website :)

--