X
Tap here to go to the mobile version of the site.
An updated version of Firefox is available to address the issues with Add-ons disabled or fail to install on Firefox. You can download the update for your OS here: https://www.mozilla.org/firefox/new/ For Known Issues and Workarounds, please check out the update at https://support.mozilla.org/kb/add-ons-disabled-or-fail-to-install-firefox

Support Forum

CSS style the "Bookmark This Page" popup - move labels

Posted

Using CSS, is it possible to move elements like labels from one row to another on an object like the "Bookmark This Page" popup - as the one in Fx 65? Or another relatively simple way? See screenshot w/ labels beside data fields.

Several versions ago & still in Fx ESR 60.x versions, the labels were logically beside the entry fields.

Putting labels on their own rows wastes too much vertical space, that's better used to show more expanded bookmarks treeview. I don't think widening the bookmark panel is much trouble.

I could reclaim a little space by hiding some labels & resizing their rows. I need keep labels "Tags" and "Keyword" - either as is, or moved to the left of their data field.

Using CSS, is it possible to move elements like labels from one row to another on an object like the "Bookmark This Page" popup - as the one in Fx 65? Or another relatively simple way? See screenshot w/ labels beside data fields. Several versions ago & still in Fx ESR 60.x versions, the labels were logically beside the entry fields. Putting labels on their own rows wastes too much vertical space, that's better used to show more expanded bookmarks treeview. I don't think widening the bookmark panel is much trouble. I could reclaim a little space by hiding some labels & resizing their rows. I need keep labels "Tags" and "Keyword" - either as is, or moved to the left of their data field.
Attached screenshots

Modified by Joebt

Quote

Additional System Details

Installed Plug-ins

None

Application

  • User Agent: Mozilla/5.0 (Windows NT 6.1; rv:65.0) Gecko/20100101 Firefox/65.0

More Information

WestEnd
  • Top 10 Contributor
60 solutions 5125 answers

Which css are you using and the site you got it from?

Which css are you using and the site you got it from?
Was this helpful to you?
Quote

Question owner

Not a person in all of Mozilla land knows what would be needed to move labels to the same line as the field they describe?

@WestEnd - uh, could you give more details of what you're looking for? CSS for what - the bookmark panel w/ labels beside the entry field? If that's what you're asking - I didn't get CSS for it. That's the way it was in previous versions & the way it still is in Fx 60.x ESR.

I think the html for the bookmark panel (popup) would have to be modified so the labels are on the same line as the text field & expander buttons. Looking at how the html code for a single row (say, name row: vbox id="BMPanel_nameRow") in Fx 60 ESR is written vs. quantum 65.x. jscher should be able to knock that out in 15 min.

I haven't looked into what you'd do with the modified html code, even if you got the syntax correct, given differences in html code of the ESR vs. regular Fx versions.

As far as reducing the huge wasted space on the latest bookmark panel, I shrunk it a good bit - removing a lot of padding or margins on elements.

Reducing height of text fields (but same font size), reducing height of the Cancel & Done buttons (that look like old "big key cell phones" marketed to seniors) and reducing a few other objects and / or spacing to reasonable sizes.

Then you can considerably increase the expanded size of the bookmarks treeview. Note: I also made a couple of rows on the panel visible that are hidden by default.

Not a person in all of Mozilla land knows what would be needed to move labels to the same line as the field they describe? @WestEnd - uh, could you give more details of what you're looking for? CSS for what - the bookmark panel w/ labels beside the entry field? If that's what you're asking - I didn't get CSS for it. That's the way it was in previous versions & the way it still is in Fx 60.x ESR. I think the html for the bookmark panel (popup) would have to be modified so the labels are on the same line as the text field & expander buttons. Looking at how the html code for a single row (say, name row: vbox id="BMPanel_nameRow") in Fx 60 ESR is written vs. quantum 65.x. jscher should be able to knock that out in 15 min. I haven't looked into what you'd '''do with the modified html''' code, even if you got the syntax correct, given differences in html code of the ESR vs. regular Fx versions. As far as reducing the huge wasted space on the latest bookmark panel, I shrunk it a good bit - removing a lot of padding or margins on elements. Reducing height of text fields (but same font size), reducing height of the Cancel & Done buttons (that look like old "big key cell phones" marketed to seniors) and reducing a few other objects and / or spacing to reasonable sizes. Then you can considerably increase the expanded size of the bookmarks treeview. Note: I also made a couple of rows on the panel visible that are hidden by default.
Was this helpful to you?
Quote
the-edmeister
  • Top 25 Contributor
  • Moderator
5386 solutions 39975 answers

IMO, your expectations of the support contributors here is too high.

Look for the CSS you need here: https://www.reddit.com/r/FirefoxCSS/

IMO, your expectations of the support contributors here is too high. Look for the CSS you need here: https://www.reddit.com/r/FirefoxCSS/
Was this helpful to you?
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.