X
Tippen Sie hierhin, um die Version dieser Website für Mobilgeräte aufzurufen.

Hilfeforum

customization of the Print Preview page possible the CSS of the page

Veröffentlicht

FF 60.1.0 running on Ubuntu 14.04 I need to configure, or change, the buttons on the HTML page that appears when you click the Printer Icon. FF is working fine and is highly configured for a specific use and it works fine, no issues. But when the printer page comes up, with "Print", "Print Setup", and so on; there is a need to re-arrange the buttons that appear on the top of the page. Specifically the "Close" button needs to be moved to the far left instead of the far right - see the image which shows the layout of the top row of buttons. Try as I might looking through source code (I did fine printPreview.dtd and printPreview.css and have examined omni.ja) I cannot figure out what the CSS is on the page in the image because I cannot get FF to show me the HTML source for the page. Greatly appreciate any help.

FF 60.1.0 running on Ubuntu 14.04 I need to configure, or change, the buttons on the HTML page that appears when you click the Printer Icon. FF is working fine and is highly configured for a specific use and it works fine, no issues. But when the printer page comes up, with "Print", "Print Setup", and so on; there is a need to re-arrange the buttons that appear on the top of the page. Specifically the "Close" button needs to be moved to the far left instead of the far right - see the image which shows the layout of the top row of buttons. Try as I might looking through source code (I did fine printPreview.dtd and printPreview.css and have examined omni.ja) I cannot figure out what the CSS is on the page in the image because I cannot get FF to show me the HTML source for the page. Greatly appreciate any help.
Angefügte Screenshots

Ausgewählte Lösung

I see this issue as well and usually go to Full Screen mode, but moving the close button is probably easier. I don't know if it would be possible to wrap the toolbar button to a second line.

This code in userChrome.css works for me, so give it a try.

#main-window #print-preview-toolbar button[label="Close"] {-moz-box-ordinal-group:0}

Diese Antwort im Kontext lesen 1
Zitieren

Mehr Details zum System

Anwendung

  • User-Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:66.0) Gecko/20100101 Firefox/66.0

Weitere Informationen

jscher2000
  • Top 10 Contributor
8638 Lösungen 70674 Antworten
Veröffentlicht

Hilfreiche Antwort

The window is too narrow for the entire Print Preview toolbar to fit? Hmm...

This is the XUL code for the bar. (I don't know the actual source code, this is extracted from the Inspector in the Browser Toolbox).

<toolbar fullscreentoolbar="true" id="print-preview-toolbar">   <button id="print-preview-print" label="Print…" accesskey="P" oncommand="this.parentNode.print();"/>   <button id="print-preview-pageSetup" label="Page Setup…" accesskey="u" oncommand="this.parentNode.doPageSetup();"/>   <vbox align="center" pack="center"><label value="Page:" accesskey="a" control="print-preview-pageNumber"/></vbox>   <toolbarbutton id="print-preview-navigateHome" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(0, 0, 'home');" tooltiptext="First page" label="⏮"/>   <toolbarbutton id="print-preview-navigatePrevious" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(-1, 0, 0);" tooltiptext="Previous page" label="◂"/>   <hbox align="center" pack="center"><html:input id="print-preview-pageNumber" hidespinbuttons="true" type="number" value="1" min="1" max="2" /><label value="of"/><label id="print-preview-totalPages" value="2"/></hbox>   <toolbarbutton id="print-preview-navigateNext" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(1, 0, 0);" tooltiptext="Next page" label="▸"/>   <toolbarbutton id="print-preview-navigateEnd" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(0, 0, 'end');" tooltiptext="Last page" label="⏭"/>   <toolbarseparator class="toolbarseparator-primary"/>   <vbox align="center" pack="center"><label id="print-preview-scale-label" value="Scale:" accesskey="S" control="print-preview-scale"/></vbox>   <hbox align="center" pack="center"><menulist id="print-preview-scale" crop="none" oncommand="parentNode.parentNode.scale(this.selectedItem.value);" value="ShrinkToFit" label="Shrink To Fit"><menupopup><menuitem value="0.3" label="30%"/><menuitem value="0.4" label="40%"/><menuitem value="0.5" label="50%"/><menuitem value="0.6" label="60%"/><menuitem value="0.7" label="70%"/><menuitem value="0.8" label="80%"/><menuitem value="0.9" label="90%"/><menuitem value="1" label="100%"/><menuitem value="1.25" label="125%"/><menuitem value="1.5" label="150%"/><menuitem value="1.75" label="175%"/><menuitem value="2" label="200%"/><menuseparator/><menuitem flex="1" value="ShrinkToFit" label="Shrink To Fit" selected="true"/><menuitem value="Custom" label="Custom…"/></menupopup></menulist></hbox>   <toolbarseparator class="toolbarseparator-primary"/>   <hbox align="center" pack="center"><toolbarbutton id="print-preview-portrait-button" label="Portrait" accesskey="o" type="radio" group="orient" class="tabbable" oncommand="parentNode.parentNode.orient('portrait');" checked="true"/><toolbarbutton id="print-preview-landscape-button" label="Landscape" accesskey="L" type="radio" group="orient" class="tabbable" oncommand="parentNode.parentNode.orient('landscape');"/></hbox>   <toolbarseparator class="toolbarseparator-primary"/>   <checkbox id="print-preview-simplify" label="Simplify Page" checked="false" accesskey="i" tooltiptext-disabled="This page cannot be automatically simplified" tooltiptext-enabled="Change layout for easier reading" oncommand="this.parentNode.simplify();" tooltiptext="Change layout for easier reading"/>   <toolbarseparator class="toolbarseparator-primary"/>   <button label="Close" accesskey="C" oncommand="PrintUtils.exitPrintPreview();"/><data id="print-preview-prompt-title" value="Custom Scale…"/> </toolbar>

I can't think of a CSS-only way to move the last button on the bar to the beginning of the bar, although there might be a trick.

Otherwise, you could probably apply rules to make the other controls narrower to allow space for the Close button on the right end.

The window is too narrow for the entire Print Preview toolbar to fit? Hmm... This is the XUL code for the bar. (I don't know the actual source code, this is extracted from the Inspector in the [https://developer.mozilla.org/docs/Tools/Browser_Toolbox Browser Toolbox]). &lt;toolbar fullscreentoolbar="true" id="print-preview-toolbar"> &nbsp;&nbsp;&lt;button id="print-preview-print" label="Print…" accesskey="P" oncommand="this.parentNode.print();"/> &nbsp;&nbsp;&lt;button id="print-preview-pageSetup" label="Page Setup…" accesskey="u" oncommand="this.parentNode.doPageSetup();"/> &nbsp;&nbsp;&lt;vbox align="center" pack="center">&lt;label value="Page:" accesskey="a" control="print-preview-pageNumber"/>&lt;/vbox> &nbsp;&nbsp;&lt;toolbarbutton id="print-preview-navigateHome" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(0, 0, 'home');" tooltiptext="First page" label="⏮"/> &nbsp;&nbsp;&lt;toolbarbutton id="print-preview-navigatePrevious" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(-1, 0, 0);" tooltiptext="Previous page" label="◂"/> &nbsp;&nbsp;&lt;hbox align="center" pack="center">&lt;html:input id="print-preview-pageNumber" hidespinbuttons="true" type="number" value="1" min="1" max="2" />&lt;label value="of"/>&lt;label id="print-preview-totalPages" value="2"/>&lt;/hbox> &nbsp;&nbsp;&lt;toolbarbutton id="print-preview-navigateNext" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(1, 0, 0);" tooltiptext="Next page" label="▸"/> &nbsp;&nbsp;&lt;toolbarbutton id="print-preview-navigateEnd" class="print-preview-navigate-button tabbable" oncommand="parentNode.navigate(0, 0, 'end');" tooltiptext="Last page" label="⏭"/> &nbsp;&nbsp;&lt;toolbarseparator class="toolbarseparator-primary"/> &nbsp;&nbsp;&lt;vbox align="center" pack="center">&lt;label id="print-preview-scale-label" value="Scale:" accesskey="S" control="print-preview-scale"/>&lt;/vbox> &nbsp;&nbsp;&lt;hbox align="center" pack="center">&lt;menulist id="print-preview-scale" crop="none" oncommand="parentNode.parentNode.scale(this.selectedItem.value);" value="ShrinkToFit" label="Shrink To Fit">&lt;menupopup>&lt;menuitem value="0.3" label="30%"/>&lt;menuitem value="0.4" label="40%"/>&lt;menuitem value="0.5" label="50%"/>&lt;menuitem value="0.6" label="60%"/>&lt;menuitem value="0.7" label="70%"/>&lt;menuitem value="0.8" label="80%"/>&lt;menuitem value="0.9" label="90%"/>&lt;menuitem value="1" label="100%"/>&lt;menuitem value="1.25" label="125%"/>&lt;menuitem value="1.5" label="150%"/>&lt;menuitem value="1.75" label="175%"/>&lt;menuitem value="2" label="200%"/>&lt;menuseparator/>&lt;menuitem flex="1" value="ShrinkToFit" label="Shrink To Fit" selected="true"/>&lt;menuitem value="Custom" label="Custom…"/>&lt;/menupopup>&lt;/menulist>&lt;/hbox> &nbsp;&nbsp;&lt;toolbarseparator class="toolbarseparator-primary"/> &nbsp;&nbsp;&lt;hbox align="center" pack="center">&lt;toolbarbutton id="print-preview-portrait-button" label="Portrait" accesskey="o" type="radio" group="orient" class="tabbable" oncommand="parentNode.parentNode.orient('portrait');" checked="true"/>&lt;toolbarbutton id="print-preview-landscape-button" label="Landscape" accesskey="L" type="radio" group="orient" class="tabbable" oncommand="parentNode.parentNode.orient('landscape');"/>&lt;/hbox> &nbsp;&nbsp;&lt;toolbarseparator class="toolbarseparator-primary"/> &nbsp;&nbsp;&lt;checkbox id="print-preview-simplify" label="Simplify Page" checked="false" accesskey="i" tooltiptext-disabled="This page cannot be automatically simplified" tooltiptext-enabled="Change layout for easier reading" oncommand="this.parentNode.simplify();" tooltiptext="Change layout for easier reading"/> &nbsp;&nbsp;&lt;toolbarseparator class="toolbarseparator-primary"/> &nbsp;&nbsp;&lt;button label="Close" accesskey="C" oncommand="PrintUtils.exitPrintPreview();"/>&lt;data id="print-preview-prompt-title" value="Custom Scale…"/> &lt;/toolbar> I can't think of a CSS-only way to move the last button on the bar to the beginning of the bar, although there might be a trick. Otherwise, you could probably apply rules to make the other controls narrower to allow space for the Close button on the right end.
Hat Ihnen das weitergeholfen? 1
Zitieren
cor-el
  • Top 10 Contributor
  • Moderator
17422 Lösungen 157414 Antworten
Veröffentlicht

Ausgewählte Lösung

I see this issue as well and usually go to Full Screen mode, but moving the close button is probably easier. I don't know if it would be possible to wrap the toolbar button to a second line.

This code in userChrome.css works for me, so give it a try.

#main-window #print-preview-toolbar button[label="Close"] {-moz-box-ordinal-group:0}

I see this issue as well and usually go to Full Screen mode, but moving the close button is probably easier. I don't know if it would be possible to wrap the toolbar button to a second line. This code in userChrome.css works for me, so give it a try. <pre><nowiki>#main-window #print-preview-toolbar button[label="Close"] {-moz-box-ordinal-group:0}</nowiki></pre> ---- *https://www.userchrome.org/how-create-userchrome-css.html *https://www.userchrome.org/what-is-userchrome-css.html
Hat Ihnen das weitergeholfen? 1
Zitieren
Stellen Sie eine Frage

Sie müssen sich mit Ihrem Benutzerkonto anmelden, um auf Beiträge zu antworten. Bitte stellen Sie eine neue Frage, wenn Sie noch kein Benutzerkonto haben.