Recommended Posts

I have two buttons positioned at the extreme left side of the toolbar. From left to right, one is for new tab and the second is for the "home page". Both buttons are png files stored in a local directory:

toolbox[iconsize="small"] #new-tab-button > .toolbarbutton-icon { list-style-image: url("file:///e:/Pics/newtab.png") !important; padding-top: 9px !important; padding-left: 4px !important; }

toolbox[iconsize="small"] #home-button > .toolbarbutton-icon { list-style-image: url("file:///e:/Pics/home.png") !important; -moz-image-region: rect(0px,18px,16px,1px) !important; padding-bottom: 2px !important; }

The thing that I cannot understand is why it seems that this part, "-moz-image-region: rect(0px,18px,16px,1px) !important;", is necessary for the home button png to be displayed. Omitting it gives me a blank space (which is still functional in that clicking on the blank space sends me to the home page). There is no other image in the rectangle and the png in question is 19x17 px. I have tried fiddling with various padding settings, left, right, bottom, and top with no success.

I have no problem with the new tab png.

I have two buttons positioned at the extreme left side of the toolbar. From left to right, one is for new tab and the second is for the "home page". Both buttons are png files stored in a local directory:

The thing that I cannot understand is why it seems that this part, "-moz-image-region: rect(0px,18px,16px,1px) !important;", is necessary for the home button png to be displayed. Omitting it gives me a blank space (which is still functional in that clicking on the blank space sends me to the home page). There is no other image in the rectangle and the png in question is 19x17 px. I have tried fiddling with various padding settings, left, right, bottom, and top with no success.

I have no problem with the new tab png.

Try using this instead.

-moz-image-region: auto !important;

Thanks, Soapy, that works just perfectly :) .

(But what is special about the home button that is requiring specifying "-moz-image-region" at all? Why don't I need it for the new tab?)

All the toolbar buttons are already given a list-style-image and -moz-image-region. If you try to point it to a new list-style-image it will still use the old -moz-image-region value. Setting -moz-image-region: auto just tells it to use the whole image. Hope that makes sense.

All the toolbar buttons are already given a list-style-image and -moz-image-region. If you try to point it to a new list-style-image it will still use the old -moz-image-region value. Setting -moz-image-region: auto just tells it to use the whole image. Hope that makes sense.

Okay, thanks for the explanation :)

In other words, a standalone png (like the new tab one) wouldn't need the moz-image-region but the various pngs that are normally part of toolbar.png will. I hope I got that right!

Okay, thanks for the explanation :)

In other words, a standalone png (like the new tab one) wouldn't need the moz-image-region but the various pngs that are normally part of toolbar.png will. I hope I got that right!

https://developer.mozilla.org/en/CSS/-moz-image-region

http://browsers-dox.net/Que-Firefox.and.Thunderbird-/0789734583/ch15lev1sec3.html

Foxxyn8, thanks for those links. I had referred to the first one when I wanted to point to a specific button in the multibutton image. My confusion arose after I reduced the multibutton image to a single button image with Gimp. But all is well (for) now.

Hi is there a way to have the download window work like it does in this mockup.

44d20844e231f85e5364b11c1c7d4b7e4ebf0deb.png

My God that mockup is so beautiful. Someone needs to make it a reality.

Also I believe there were a couple of test builds that actually have that functionality. you click the download button and that download window pops up exactly like in the preview. It never made it into the RC though.

Follow-up requests!

Is there a way to style the buttons?

Can I get rid of the "opacity effect" on the rest of the page?

to style just those buttons start with this and add the selectors and properties you want to change:

tabmodalprompt button {
-moz-appearance: none !important;

get rid of overlay :

tabmodalprompt {
background: none !important;
}

Could someone please help me hide the "Bookmarks Toolbar w/separator" & "Unsorted Bookmarks w/separator" from the menu button > bookmarks menu.

I was using this code in FF3 but it no longer works:

/* Hide Bookmarks Toolbar Folder */

#bookmarksToolbarFolderMenu, #bookmarksToolbarFolderMenu+menuseparator {display: none !important;}

Could someone please help me hide the "Bookmarks Toolbar w/separator" & "Unsorted Bookmarks w/separator" from the menu button > bookmarks menu.

I was using this code in FF3 but it no longer works:

/* Hide Bookmarks Toolbar Folder */

#bookmarksToolbarFolderMenu, #bookmarksToolbarFolderMenu+menuseparator {display: none !important;}

This will hide those items in all 3 bookmark menus

#BMB_bookmarksToolbar,
#BMB_bookmarksToolbar + menuseparator,
#appmenu_bookmarksToolbar,
#appmenu_bookmarksToolbar + menuseparator,
#bookmarksToolbarFolderMenu,
#bookmarksToolbarFolderMenu + menuseparator,
#BMB_unsortedBookmarks,
#appmenu_unsortedBookmarks,
menuseparator.hide-if-empty-places-result {
        display: none !important;
}

Thx Foxxy! That was perfect.

Now that I think of it, I'd like to also remove "Bookmark This Page" since I only use the icon in the locationbar for that.

Thanks again!

#BMB_bookmarkThisPage,
#appmenu_bookmarkThisPage,
#menu_bookmarkThisPage {
        display: none !important;
}

Hey, I'm not very good with my CSS syntax, but is there a way to apply a style to all toolbars EXCEPT for the navigation bar? For example, #navigator-toolbox {} lets me adjust settings for all toolbars simultaneously, but I'd like to exclude the navigation bar from this set. Thank you.

Hey, I'm not very good with my CSS syntax, but is there a way to apply a style to all toolbars EXCEPT for the navigation bar? For example, #navigator-toolbox {} lets me adjust settings for all toolbars simultaneously, but I'd like to exclude the navigation bar from this set. Thank you.

#navigator-toolbox > toolbar:not(#nav-bar) {
}

to style just those buttons start with this and add the selectors and properties you want to change:

tabmodalprompt button {
-moz-appearance: none !important;

get rid of overlay :

tabmodalprompt {
background: none !important;
}

Thanks, foxxyn8!

I got the buttons sorted out. But a comment about the "background: none !important;" bit. On my net-banking site, when I use "background: none !important;" the modal dialog box (if that's the phrase) appears a bit transparent with the contents of the page underneath the box being somewhat visible. Changing it to "background: black !important;" wipes out the rest of the page until I close the box by hitting "OK" so I'm going with "background: black !important;".

This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Feels like Hitman in Bond skin. But overall a great game! 👍
    • Microsoft released new Defender update for Windows 11, 10, Server ISO installations by Sayan Sen Microsoft releases new Windows Defender update packages very frequently to protect against various newly discovered malware. Once a while every three months or so, the company also pushes out these updates to Windows images (WIM and VHD) and ISOs, that are used to install Windows. Hence with the newest Windows 11 update available via the official MCT tool, you should get these definitions. This update package is necessary as a Windows installation image may contain old, outdated anti-malware definitions and software binaries. Aside from better security, these updates can also provide improved performance benefits in some cases. When a new Windows installation is set up, there may be a temporary security risk due to outdated Microsoft Defender protection in the OS installation images. This happens because the antimalware software included in these images might not be up to date. Thus Microsoft says that these updated definitions essentially help close this protection gap. Microsoft delivered the latest security definitions for Windows images via security intelligence update version 1.445.323.0. The Defender package version is also the same. It applies to Windows 11, Windows 10 ESU, Windows 10 Enterprise LTSC 2021, Win 10 Ent LTSC 2019, Win 10 Ent LTSB 2016, Windows Server 2022, Windows Server 2019, and Windows Server 2016. Microsoft writes: "This package updates the anti-malware client, anti-malware engine, and signature versions in the OS installation images to following versions: Platform version: 4.18.26040.7 Engine version: 1.1.26040.8 Security intelligence version: 1.447.236.0" From Microsoft's security bulletin, we learn that the security intelligence update version 1.447.236.0 was released early last month and adds threat detections for various malware like trojan, backdoor exploits, ransomware, stealers, AutoKMS, and more. For those wondering, the latest intelligence update is version 1.451.297.0 at the time of writing.
    • Hello, Hope all is well. I am in UK.  
  • Recent Achievements

    • Dedicated
      Mark Spruce earned a badge
      Dedicated
    • Collaborator
      conkir earned a badge
      Collaborator
    • Rising Star
      olavinto went up a rank
      Rising Star
    • One Month Later
      lamborghiniv10 earned a badge
      One Month Later
    • Week One Done
      lamborghiniv10 earned a badge
      Week One Done
  • Popular Contributors

    1. 1
      +primortal
      504
    2. 2
      PsYcHoKiLLa
      271
    3. 3
      Skyfrog
      74
    4. 4
      +Edouard
      73
    5. 5
      Steven P.
      71
  • Tell a friend

    Love Neowin? Tell a friend!