Avatar for Username

Tìm kiếm hỗ trợ

Tránh các lừa đảo về hỗ trợ. Chúng tôi sẽ không bao giờ yêu cầu bạn gọi hoặc nhắn tin đến số điện thoại hoặc chia sẻ thông tin cá nhân. Vui lòng báo cáo hoạt động đáng ngờ bằng cách sử dụng tùy chọn "Báo cáo lạm dụng".

Tìm hiểu thêm

Chủ đề này đã được lưu trữ. Vui lòng hỏi một câu hỏi mới nếu bạn cần giúp đỡ.

Css won't change browser style

maya.
maya.
more options

I followed these instructions:

In Firefox browser, type about:profiles in url bar. Under the profile that is in use. Click Open Folder on the Root Directory row. If that folder does not have a chrome folder, create a folder, name it chrome. In the chrome folder, create a file named userChrome.css

Then I put in the code, but nothing has changed.

Here's the code. If someone can look at it for me, that would be great. I didn't make it, but it seems to work for everyone else who uses it. 

:root {
 --tab-curve-width: 30px;
 --tabs-border: transparent !important;
}

.tabbrowser-arrowscrollbox .arrowscrollbox-scrollbox {
 padding-inline-start: 10px !important;
}

/* To be able to see the top border of the tab */
.tab-stack {
 margin-top: 2px !important;
}

/* When the window is maximized, the first pinned tab is properly displayed. */
#TabsToolbar {
 padding-inline-start: 15px !important;
}

#tabbrowser-tabs{
 margin-left:-15px;
}

.titlebar-placeholder {
 border: none !important;
}

.titlebar-spacer {
 border: none !important;
}

/* Remove unneeded styles from Photon */
.tabbrowser-tab::before,
.tabbrowser-tab::after {
 border: none !important;
}

/* Windows 7 specific */
@media (-moz-os-version: windows-win7) {
 .tabbrowser-tab {
  background-color: transparent !important;
  border: none !important;
 }

 @media (-moz-windows-default-theme) {
  .tabbrowser-tab:not(:-moz-lwtheme) {
   background-color: transparent !important;
   border: none !important;
  }
 }
}

.tabbrowser-tab > .tab-stack > .tab-background {
  background-image: none !important;
  -moz-box-orient: horizontal !important;
  background-color: transparent !important;
  margin-top: 1px !important;
}

.tab-background[selected="true"] {
 border: none !important;
}

.tab-background {
 pointer-events: none !important;
}

.tab-line {
 display: none !important;
}

.tab-bottom-line {
 display: none !important;
}

/* Match height of new tab button (right svg) on hover */
.tabs-newtab-button {
 margin: 0 !important;
}

/* overlap the tab curves */
.tab-background {
 -moz-margin-end: -15px !important;
 -moz-margin-start: -15px !important;
}

/* Remove blue animation on tab on page load complete */
.tab-loading-burst {
 display: none !important;
}

/* Begin tab background customizations */
.tab-background[selected="true"]::before {
 border: none !important;
 content: "" !important;
 width: 30px !important;
 min-height: 30px !important;
 display: -moz-box !important;
 background-repeat: no-repeat !important;
}

.tab-background[selected="true"]::after {
 border: none !important;
 content: "" !important;
 width: 30px !important;
 min-height: 30px !important;
 display: -moz-box !important;
 background-repeat: no-repeat !important;
}

.tab-background[selected="true"] > spacer {
 margin-top: 0px !important;
}

#new-tab-button,
.tabs-newtab-button {
 width: calc(36px + 30px) !important;
 margin-inline-start: -15px !important;
 margin-top: 1px !important;
}

/* Tab hover customizations */
.close-icon:hover {
 border-radius: 50% !important;
}

/* Regular tabs */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before {
 display: -moz-box !important;
 background-repeat: no-repeat !important;
 content: "" !important;
 width: 30px !important;
 max-height: 30px !important;
 background-color: transparent !important;
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after {
 display: -moz-box !important;
 background-repeat: no-repeat !important;
 content: "" !important;
 width: 30px !important;
 max-height: 30px !important;
 background-color: transparent !important;
}

.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer {
 margin-top: 0px !important;
}

#TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]),
.tabs-newtab-button:hover,
.tabs-newtab-button:hover::before,
.tabs-newtab-button:hover::after {
 background-color: transparent !important;
}

/* New tab hover customizations */
.tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover {
 background-position: 0px 2px, 30px 4px , 36px 2px !important;
 background-repeat: no-repeat !important;
 background-size: 30px 30px, calc(100% - (2 * 30px)) 30px, 30px !important;
}

.tabs-newtab-button:hover > .toolbarbutton-icon {
 background: none !important;
 background-color: transparent !important;
}

/* Tab bar below Navigation & Bookmarks Toolbars */
#nav-bar { /* main toolbar */
 -moz-box-ordinal-group: 1 !important;
 box-shadow: non !important;
}

/* Color specific customizations */
:root {
 --svg-selected-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(50, 50, 52);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

 --svg-selected-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(50, 50, 52);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

 --background-selected-middle:
 linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)),
 linear-gradient(
 transparent
 2px,
 rgb(50, 50, 52) 2px,
 rgb(50, 50, 52)
 ),
 none !important;

 --svg-hover-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255, .1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

 --svg-hover-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>");

 --background-hover-middle:
 linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)),
 linear-gradient(
 transparent
 2px,
 rgba(255,255,255,.1) 2px,
 rgba(255,255,255,.1)
 ),
 none;

 --newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath
I followed these instructions: In Firefox browser, type about:profiles in url bar. Under the profile that is in use. Click Open Folder on the Root Directory row. If that folder does not have a chrome folder, create a folder, name it chrome. In the chrome folder, create a file named userChrome.css Then I put in the code, but nothing has changed. Here's the code. If someone can look at it for me, that would be great. I didn't make it, but it seems to work for everyone else who uses it. <pre><nowiki>:root { --tab-curve-width: 30px; --tabs-border: transparent !important; } .tabbrowser-arrowscrollbox .arrowscrollbox-scrollbox { padding-inline-start: 10px !important; } /* To be able to see the top border of the tab */ .tab-stack { margin-top: 2px !important; } /* When the window is maximized, the first pinned tab is properly displayed. */ #TabsToolbar { padding-inline-start: 15px !important; } #tabbrowser-tabs{ margin-left:-15px; } .titlebar-placeholder { border: none !important; } .titlebar-spacer { border: none !important; } /* Remove unneeded styles from Photon */ .tabbrowser-tab::before, .tabbrowser-tab::after { border: none !important; } /* Windows 7 specific */ @media (-moz-os-version: windows-win7) { .tabbrowser-tab { background-color: transparent !important; border: none !important; } @media (-moz-windows-default-theme) { .tabbrowser-tab:not(:-moz-lwtheme) { background-color: transparent !important; border: none !important; } } } .tabbrowser-tab > .tab-stack > .tab-background { background-image: none !important; -moz-box-orient: horizontal !important; background-color: transparent !important; margin-top: 1px !important; } .tab-background[selected="true"] { border: none !important; } .tab-background { pointer-events: none !important; } .tab-line { display: none !important; } .tab-bottom-line { display: none !important; } /* Match height of new tab button (right svg) on hover */ .tabs-newtab-button { margin: 0 !important; } /* overlap the tab curves */ .tab-background { -moz-margin-end: -15px !important; -moz-margin-start: -15px !important; } /* Remove blue animation on tab on page load complete */ .tab-loading-burst { display: none !important; } /* Begin tab background customizations */ .tab-background[selected="true"]::before { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"]::after { border: none !important; content: "" !important; width: 30px !important; min-height: 30px !important; display: -moz-box !important; background-repeat: no-repeat !important; } .tab-background[selected="true"] > spacer { margin-top: 0px !important; } #new-tab-button, .tabs-newtab-button { width: calc(36px + 30px) !important; margin-inline-start: -15px !important; margin-top: 1px !important; } /* Tab hover customizations */ .close-icon:hover { border-radius: 50% !important; } /* Regular tabs */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::before { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; max-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true])::after { display: -moz-box !important; background-repeat: no-repeat !important; content: "" !important; width: 30px !important; max-height: 30px !important; background-color: transparent !important; } .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected=true]) > spacer { margin-top: 0px !important; } #TabsToolbar[brighttext] > #tabbrowser-tabs > .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover, .tabs-newtab-button:hover::before, .tabs-newtab-button:hover::after { background-color: transparent !important; } /* New tab hover customizations */ .tabbrowser-tab:hover > .tab-stack > .tab-background:not([selected="true"]), .tabs-newtab-button:hover { background-position: 0px 2px, 30px 4px , 36px 2px !important; background-repeat: no-repeat !important; background-size: 30px 30px, calc(100% - (2 * 30px)) 30px, 30px !important; } .tabs-newtab-button:hover > .toolbarbutton-icon { background: none !important; background-color: transparent !important; } /* Tab bar below Navigation & Bookmarks Toolbars */ #nav-bar { /* main toolbar */ -moz-box-ordinal-group: 1 !important; box-shadow: non !important; } /* Color specific customizations */ :root { --svg-selected-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgb(50, 50, 52);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-selected-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgb(50, 50, 52);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-selected-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgb(50, 50, 52) 2px, rgb(50, 50, 52) ), none !important; --svg-hover-before: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-start)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255, .1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --svg-hover-after: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='31px' preserveAspectRatio='none'><defs><svg:clipPath id='tab-curve-clip-path-start' clipPathUnits='objectBoundingBox'><svg:path d='m 1,0.065 0.05,0 0,0.938 -1,0 0,-0.028 C 0.32082458,0.95840561 0.4353096,0.81970962 0.48499998,0.5625 0.51819998,0.3905 0.535,0.0659 1,0.065 z'/></svg:clipPath><svg:clipPath id='tab-curve-clip-path-end' clipPathUnits='objectBoundingBox'><svg:path d='m 0,0.065 -0.05,0 0,0.938 1,0 0,-0.028 C 0.67917542,0.95840561 0.56569036,0.81970962 0.51599998,0.5625 0.48279998,0.3905 0.465,0.0659 0,0.065 z'/></svg:clipPath><svg:clipPath id='tab-hover-clip-path' clipPathUnits='objectBoundingBox'><svg:path d='M 0,0.2 0,1 1,1, 1,0.2 z'/></svg:clipPath></defs><foreignObject width='30' height='31' clip-path='url(%23tab-curve-clip-path-end)'><div id='tab-background-fill' style='background-color:rgba(255, 255, 255,.1);background-repeat:no-repeat;height:100%;width:100%;' xmlns='http://www.w3.org/1999/xhtml'></div></foreignObject></svg>"); --background-hover-middle: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,0)), linear-gradient( transparent 2px, rgba(255,255,255,.1) 2px, rgba(255,255,255,.1) ), none; --newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath</nowiki></pre>

Được chỉnh sửa bởi cor-el vào

Tất cả các câu trả lời (15)

davidspriggs
davidspriggs
more options

To troubleshoot whether your new CSS is loading correctly, you can right -click > View Source on the page. Look for the links to your CSS and grid files. You should be able to follow those links and view the changed CSS. If you don't see that changed CSS when you click on the source links, you know it is a linking problem.

What are you seeing on your screen right now? and what changes did yo make from previous to now that you're trying to see reflected?

I also see that on your .btn class, the background image is tecture.png, and I would change that to texture.png. does thisd hjelp?? david

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

Did you make sure that the userChrome.css file doesn't have a hidden .css or .txt file extension (userChrome.css.css or userChrome.css.txt) if nothing in the file is working?

You may have to add the default @namespace line at the start of the file. 

@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */
maya.
maya. Người tạo câu hỏi
more options

cor-el said

Did you make sure that the userChrome.css file doesn't have a hidden .css or .txt file extension (userChrome.css.css or userChrome.css.txt) if nothing in the file is working? You may have to add the default @namespace line at the start of the file. 
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* only needed once */

Yes, I made sure there is no hidden file extension. I double checked last night before I posted, as well, just to make sure. I will try the namespace thing. Is /*only needed once*/ part of the code?

maya.
maya. Người tạo câu hỏi
more options

davidspriggs said

To troubleshoot whether your new CSS is loading correctly, you can right -click > View Source on the page. Look for the links to your CSS and grid files. You should be able to follow those links and view the changed CSS. If you don't see that changed CSS when you click on the source links, you know it is a linking problem. What are you seeing on your screen right now? and what changes did yo make from previous to now that you're trying to see reflected? I also see that on your .btn class, the background image is tecture.png, and I would change that to texture.png. does thisd hjelp?? david

Well, I'm trying to go from the normal pre-installed Firefox browser look to a customized browser look. So I'm not changing anything as just adding the CSS to a blank file to make the changes.

Would I click View Source on the userChrome.css file?

Được chỉnh sửa bởi maya. vào

WestEnd
WestEnd
more options

Just curious besides programming a custom userChrome.css is there one that matches close to what your doing? You could use that as reference as well.

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

Note that the posted code is incomplete because it exceeds the allowed maximum, so we can't test it.

You can upload the file and post a link if this data is too big to put in a reply.

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 25 Contributor
more options

It doesn't affect the functionality, but I suggest adding a comment in your CSS showing where you downloaded it from in case you need to go back for updates or support. For example, you might be using this one or a variation on it: 

/* From:
   https://github.com/wilfredwee/photon-australis/blob/master/userChrome-dark.css
*/
maya.
maya. Người tạo câu hỏi
more options

WestEnd said

Just curious besides programming a custom userChrome.css is there one that matches close to what your doing? You could use that as reference as well.

I don't know anything about coding, so this is a pre-done one by someone on Github, but he won't answer any of my questions.

maya.
maya. Người tạo câu hỏi
more options

cor-el said

Note that the posted code is incomplete because it exceeds the allowed maximum, so we can't test it. You can upload the file and post a link if this data is too big to put in a reply.

This is actually the complete code. It wouldn't let me post until I had the right amount of characters, so I took the characters out of my question, but left the code complete.

Is it missing something?

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

Yes, there is data missing. See the last rule (--newtab-hover) that doesn't have a valid SVG definition that ends with </svg>. You can compare this with the CSS rule further u (--svg-hover-after). I actually added the last 'h' and removed some white space when I edited the question to avoid breaking the code. 

 --newtab-hover: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' xmlns:svg='http://www.w3.org/2000/svg' width='30px' height='30px' preserveAspectRatio='none'><defs><svg:clipPath
jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 25 Contributor
more options

You can use the steps here to double-check your setup of the userChrome.css file: https://www.userchrome.org/how-create-userchrome-css.html

the-edmeister
the-edmeister
  • Moderator
more options

maya. said

I followed these instructions: In Firefox browser, type about:profiles in url bar. Under the profile that is in use. Click Open Folder on the Root Directory row. If that folder does not have a chrome folder, create a folder, name it chrome. In the chrome folder, create a file named userChrome.css Then I put in the code, but nothing has changed.

Are you closing Firefox before creating the chrome folder and adding your userChrome.css file?

AFAIK, when Firefox is running it won't accept changes or additions to the Profile.

cor-el
cor-el
  • Moderator
  • Top 10 Contributor
more options

It doesn't really matter if you create the chrome folder and userChrome.css file while Firefox is running because Firefox only reads these files. These files are additional files and Firefox will pick up changes on the next start. If it doesn't work then there is either a problem with the file name (possible extra file extensions) or with the file format (not plain text) or the file is corrupted.

The missing default @namespace line at the start also can cause problems.

maya.
maya. Người tạo câu hỏi
more options

Unfortunately, none of these solutions solved the issue. Does anyone have any other CSS codes that does the same as the one I'm trying to do that I can try and that you know work?

jscher2000 - Support Volunteer
jscher2000 - Support Volunteer
  • Top 25 Contributor
more options

Hi maya., are any rules in your userChrome.css file working? If you need a tester file, you can use the buttons below the large blue box on this page to download a userChrome.css file:

https://www.userchrome.org/download-userchrome-css.html

All that example rule does is turn off the blue swipe across the tab that appears when a page finishes loading. Does it work on yours?

If it doesn't work, please review the placement of your chrome folder by checking against the steps here:

https://www.userchrome.org/how-create-userchrome-css.html