userchrome.css-Codes gesucht!

katzi

Hallo an alle,

das mit dem Blocksatz funktioniert noch nicht. Ich kann ihn zwar nun einrichten, nur klappt das nur auf alle Schriften, was mir nix nützt. Überschriften sollen weiterhin normal links oder mittig dargestellt werden, lediglich Quoteblöcke und andere reine Textblöcke will ich als Blocksatz haben. Und das in einer Struktur, die Stylish versteht.

Alternativ auch in der Art, daß ich dieses in die direkten Firefox-Dateien eintrage, sofern es da andere außer userChrome.css und userContent.css gibt. Ich habe keinen Bock, für jede Webseite via Stylish eine separate Anweisung zu schreiben. Das muß doch einfacher gehen?

Selbst das, was ich hier jetzt schreibe, erscheint noch nicht als Blocksatz.

ciao
katzi (m)

PS.: Gibt es eine Erweiterung oder sonst ein Hilfsmittel, mit dem ich per Mauszeiger auf der im Browser geladenen Homepage feststellen kann, welches Element im Quelltext dieser Homepage gerade dafür zuständig ist?

Dr. Evil

Zitat von katzi

PS.: Gibt es eine Erweiterung oder sonst ein Hilfsmittel, mit dem ich per Mauszeiger auf der im Browser geladenen Homepage feststellen kann, welches Element im Quelltext dieser Homepage gerade dafür zuständig ist?

DOM Inspector + InspectThis

katzi

Zitat von Dr. Evil

DOM Inspector + InspectThis

Hallo Dr. Evil,

ja, den DOM hatte ich vorher schon. Diese "InspectThis"-Erweiterung kannte ich noch nicht und habe sie daher flugs installiert. Im Endeffekt brachte mir dieses aber nicht das gewünschte Resultat.

Der Quellcode der geladenen Firfoxbrowser.de-Homepage beispielsweise, (also hier vom Forum), wird mir so angezeigt:

Code

/* General page style. The scroll bar colours only visible in IE5.5+ */
body {
	background-color: #E5E5E5;
	scrollbar-face-color: #DEE3E7;
	scrollbar-highlight-color: #FFFFFF;
	scrollbar-shadow-color: #DEE3E7;
	scrollbar-3dlight-color: #D1D7DC;
	scrollbar-arrow-color:  #006699;
	scrollbar-track-color: #EFEFEF;
	scrollbar-darkshadow-color: #98AAB1;
}


/* General font families for common tags */
font,th,td,p { font-family: Verdana, Arial, Helvetica, sans-serif }
a:link,a:active,a:visited { color : #006699; }
a:hover		{ text-decoration: underline; color : #DD6900; }
hr	{ height: 0px; border: solid #D1D7DC 0px; border-top-width: 1px;}


/* This is the border line & background colour round the entire page */
.bodyline	{ background-color: #FFFFFF; border: 1px #98AAB1 solid; }


/* This is the outline round the main forum tables */
.forumline	{ background-color: #FFFFFF; border: 2px #006699 solid; }


/* Main table cell colours and backgrounds */
td.row1	{ background-color: #EFEFEF; }
td.row2	{ background-color: #DEE3E7; }
td.row3	{ background-color: #D1D7DC; }


/*
  This is for the table cell above the Topics, Post & Last posts on the index.php page
  By default this is the fading out gradiated silver background.
  However, you could replace this with a bitmap specific for each forum
*/
td.rowpic {
		background-color: #FFFFFF;
		background-image: url(templates/subSilver/images/cellpic2.jpg);
		background-repeat: repeat-y;
}


/* Header cells - the blue and silver gradient backgrounds */
th	{
	color: #FFA34F; font-size: 11px; font-weight : bold;
	background-color: #006699; height: 25px;
	background-image: url(templates/subSilver/images/cellpic3.gif);
}


td.cat,td.catHead,td.catSides,td.catLeft,td.catRight,td.catBottom {
			background-image: url(templates/subSilver/images/cellpic1.gif);
			background-color:#D1D7DC; border: #FFFFFF; border-style: solid; height: 28px;
}


/*
  Setting additional nice inner borders for the main table cells.
  The names indicate which sides the border will be on.
  Don't worry if you don't understand this, just ignore it :-)
*/
td.cat,td.catHead,td.catBottom {
	height: 29px;
	border-width: 0px 0px 0px 0px;
}
th.thHead,th.thSides,th.thTop,th.thLeft,th.thRight,th.thBottom,th.thCornerL,th.thCornerR {
	font-weight: bold; border: #FFFFFF; border-style: solid; height: 28px;
}
td.row3Right,td.spaceRow {
	background-color: #D1D7DC; border: #FFFFFF; border-style: solid;
}


th.thHead,td.catHead { font-size: 12px; border-width: 1px 1px 0px 1px; }
th.thSides,td.catSides,td.spaceRow	 { border-width: 0px 1px 0px 1px; }
th.thRight,td.catRight,td.row3Right	 { border-width: 0px 1px 0px 0px; }
th.thLeft,td.catLeft	  { border-width: 0px 0px 0px 1px; }
th.thBottom,td.catBottom  { border-width: 0px 1px 1px 1px; }
th.thTop	 { border-width: 1px 0px 0px 0px; }
th.thCornerL { border-width: 1px 0px 0px 1px; }
th.thCornerR { border-width: 1px 1px 0px 0px; }


/* The largest text used in the index page title and toptic title etc. */
.maintitle	{
	font-weight: bold; font-size: 22px; font-family: "Trebuchet MS",Verdana, Arial, Helvetica, sans-serif;
	text-decoration: none; line-height : 120%; color : #000000;
}


/* General text */
.gen { font-size : 12px; }
.genmed { font-size : 11px; }
.gensmall { font-size : 10px; }
.gen,.genmed,.gensmall { color : #000000; }
a.gen,a.genmed,a.gensmall { color: #006699; text-decoration: none; }
a.gen:hover,a.genmed:hover,a.gensmall:hover	{ color: #DD6900; text-decoration: underline; }


/* The register, login, search etc links at the top of the page */
.mainmenu		{ font-size : 11px; color : #000000 }
a.mainmenu		{ text-decoration: none; color : #006699;  }
a.mainmenu:hover{ text-decoration: underline; color : #DD6900; }


/* Forum category titles */
.cattitle		{ font-weight: bold; font-size: 12px ; letter-spacing: 1px; color : #006699}
a.cattitle		{ text-decoration: none; color : #006699; }
a.cattitle:hover{ text-decoration: underline; }


/* Forum title: Text and link to the forums used in: index.php */
.forumlink		{ font-weight: bold; font-size: 12px; color : #006699; }
a.forumlink 	{ text-decoration: none; color : #006699; }
a.forumlink:hover{ text-decoration: underline; color : #DD6900; }


/* Used for the navigation text, (Page 1,2,3 etc) and the navigation bar when in a forum */
.nav			{ font-weight: bold; font-size: 11px; color : #000000;}
a.nav			{ text-decoration: none; color : #006699; }
a.nav:hover		{ text-decoration: underline; }


/* titles for the topics: could specify viewed link colour too */
.topictitle,h1,h2	{ font-weight: bold; font-size: 11px; color : #000000; }
a.topictitle:link   { text-decoration: none; color : #006699; }
a.topictitle:visited { text-decoration: none; color : #5493B4; }
a.topictitle:hover	{ text-decoration: underline; color : #DD6900; }


/* Name of poster in viewmsg.php and viewtopic.php and other places */
.name			{ font-size : 11px; color : #000000;}


/* Location, number of posts, post date etc */
.postdetails		{ font-size : 10px; color : #000000; }


/* The content of the posts (body of text) */
.postbody[/color] { font-size : 12px; line-height: 18px}
a.postlink:link	{ text-decoration: none; color : #006699 }
a.postlink:visited { text-decoration: none; color : #5493B4; }
a.postlink:hover { text-decoration: underline; color : #DD6900}


/* Quote & Code blocks */
.code {
	font-family: Courier, 'Courier New', sans-serif; font-size: 11px; color: #006600;
	background-color: #FAFAFA; border: #D1D7DC; border-style: solid;
	border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


.quote {
	font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #444444; line-height: 125%;
	background-color: #FAFAFA; border: #D1D7DC; border-style: solid;
	border-left-width: 1px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px
}


/* Copyright and bottom info */
.copyright		{ font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; color: #444444; letter-spacing: -1px;}
a.copyright		{ color: #444444; text-decoration: none;}
a.copyright:hover { color: #000000; text-decoration: underline;}


/* Form elements */
input,textarea, select {
	color : #000000;
	font: normal 11px Verdana, Arial, Helvetica, sans-serif;
	border-color : #000000;
}


/* The text input fields background colour */
input.post, textarea.post, select {
	background-color : #FFFFFF;
}


input { text-indent : 2px; }


/* The buttons used for bbCode styling in message post */
input.button {
	background-color : #EFEFEF;
	color : #000000;
	font-size: 11px; font-family: Verdana, Arial, Helvetica, sans-serif;
}


/* The main submit button option */
input.mainoption {
	background-color : #FAFAFA;
	font-weight : bold;
}


/* None-bold submit button */
input.liteoption {
	background-color : #FAFAFA;
	font-weight : normal;
}


/* This is the line in the posting page which shows the rollover
  help line. This is actually a text box, but if set to be the same
  colour as the background no one will know ;)
*/
.helpline { background-color: #DEE3E7; border-style: none; }

Alles anzeigen

Diesen habe ich komplett in Stylish übernommen und zuerst einmal überall meine gewünschten Farben eingesetzt. Dann wollte ich Blocksatz einstellen. Geklappt hat dieses aber bisher nur beim Quote-Block, beim regulären Text scheitert ein text-align: justify !important;. Es geht weder bei dem von InspectThis angezeigten .postbody, noch bei irgend einem anderen Punkt des obigen Quellcodes.

Wo liegt der Fehler?

ciao und merci
katzi (m)

PS.: Eine farbliche Kennzeichnung des .postbody in obigen Code-Block funzt net.

PS2.: Obiger Quellcode ist das unveränderte Original.

ZweiVier

vielleicht kannst ja von hier was gebrauchen
>>>>> http://www.firefox-browser.de/forum/viewtopi…p=485015#485015

Dr. Evil

Zitat von katzi

Wo liegt der Fehler?

text-align funktioniert nur bei Block-Elementen. Span ist ein Inline-Element, darum muss man es erst gewaltsam zu einem Block-Element machen:

CSS

display: block !important;

Estartu

katzi: Einfacher gehts damit: debianforum.de-Theme DE v1.1.0

ZweiVier

Serwas,
versuch seit geraumer Zeit die Schrift in der
All in one Sidebar zu verschieben, wenn ich aber

CSS

richlistbox #extensionsView .addonName { font-size: 100% !important; font-weight: bold !important;
color: #fff !important; max-width: 250px !important; margin-left: 0px !important; margin-right: 10px !important;}

nehme verschiebt sich die komplette schrift wie im bild angezeigt,
ich möchte aber nur die schrift im roten kasten verschieben.
Hat wer ne Idee?

[Blockierte Grafik: http://img3.imagebanana.com/img/9f9u91vv/Aufzeichnen.PNG]

katzi

Zitat von Dr. Evil
text-align funktioniert nur bei Block-Elementen. Span ist ein Inline-Element, darum muss man es erst gewaltsam zu einem Block-Element machen:
CSS
display: block !important;

Hallo Dr. Evil und andere,

Dein Tip mit

CSS

display: block !important;

hat in Bezug auf die Konstruktion dieser Homepage und aller, die darauf aufbauen, geholfen; es wird nun alles, was soll, wunschgemäß im Blocktext dargestellt.

Bei anderen Webseiten wie http://www.elo-forum.org/ geht dieses jedoch noch nicht so problemlos. Hier ist der Text auf der einen Seite, (Quellcode-Element ".alt1"), zwar als Blocktext darstellbar, aber zeitgleich wird der Texttitel auf der vorangehenden Seite mit dem gleichen Quellcode-Element ".alt1" bezeichnet; es wird also auch die Überschrift als Blocksatz dargestellt. Gibt es hier noch eine Möglichkeit, das zu trennen?

Ein systemweites display: block !important; bringt mir die ganze Seite durcheinander unmd ist keine Lösung.

ciao
katzi (m)

Dr. Evil

versuche es mit div[id^="post_message_"] statt .alt1

katzi

Zitat von Dr. Evil

versuche es mit div[id^="post_message_"] statt .alt1

Ok, merci, dieser Versuch klappt, aber nur für einen Teil. Der Text ist zwar jetzt auch dort vollständig im Blocksatz, wunschgemäß nunmehr mit richtiger Darstellung der links- oder rechtsbündigen Überschriften, doch klappt es noch nicht ganz im Sinne der Rahmengestaltung, der sich um diese Texte befindet.

Der entsprechende Abschnitt schaut nun so aus:

CSS

div[id^="post_message_"]
{
background: #FFAE00 !important;
color: #000000 !important;
border: outset #E37D00 2px !important;
white-space: normal !important;
text-align: justify !important; 
padding-left: 10px !important; padding-right: 10px !important; padding-top: 10px !important; padding-bottom: 10px !important; }

Dieses klappt nur für das im Quelltext zuerst genannte Element .alt1, für den Text, der sich in Zitaten befindet und intern auch mit dem Element .alt2 bezeichnet wird, wirkt sich der "border-style" nicht aus.

Sollte es nicht die Möglichkeit geben, die Quellcode-Elemente .alt1 und .alt2 mit dem von Dir genannten div[id^="post_message_" separat zu verbinden? Einfach deshalb, da ich für die beiden Quellcode-Elemente .alt1 und .alt2 verschiedene Hintergrundfarben festgelegt habe.

Zur Erinnerung: mit diesen beiden Quellcode-Elementen werden nicht nur zwei aufeinanderfolgende Threadüberschriften farblich voneinander unterschieden, (Beispiel in Bezug auf die schon genannte Homepage http://www.elo-forum.org/allgemeine-fragen/), nein auch die Unterscheidung zwischen Antworttext und Zitat basiert auf den gleichen zwei Quellcode-Elementen, (Beispiel siehe hier http://www.elo-forum.org/allgemeine-fra…rbeitgeber.html). Läßt sich also anhand dieses Quellcodes nicht eine zusätzlich Unterscheidung bzw. Verknüpfung realisieren, die mir auch neben dem Blocksatz im Zitat, der ja angezeigt wird, auch den gewünschte Border-Style umsetzt?

ciao und merci
katzi (m)

PS.: Edit am 17.11.08:

Gibt es eine Möglichkeit, den Editor via Stylish zu vergrößern? (Der Editor ist jenes Gebilde, in dem ich jetzt hier die Zeilen schreibe).

Steph

CSS

@namespace url(http://www.w3.org/1999/xhtml);
@-moz-document domain("firefox-browser.de") {
textarea{width:900px !important;height:600px !important}
}

Global Associate

Moin
Ich suche was, daß den "Close" Button in (Nasa Night Launch) rot darstellt. Habe mich schon bei "Stylish" umgeschaut. Tabs Änderungen gibts ja ohne Ende, aber....

[Blockierte Grafik: http://img3.imagebanana.com/img/b88b5udr/closebutton.png]

(möchte mich jetzt nicht durch den Thread wühlen...)

-GA-

ZweiVier

Hast was mit dem Betriebssystem zu tun.....
Unter Vista is der Closebutton rot.
[Blockierte Grafik: http://img3.imagebanana.com/img/osv1f6rk/Aufzeichnen.PNG]

katzi

Mal noch 'ne Frage. Lassen sich um die ausgeklappten Menüs Rahmen zaubern? (Also um die Popup-Menüs). Die hätte überall gern noch einen andersfarbigen "Inset" oder "Outset" Rahmen drumherum.

ciao
katzi (m)

MaximaleEleganz

CSS

menupopup, popup { 
   border: 1px solid !important;
   -moz-border-top-colors: #000000!important; -moz-border-right-colors: #000000 !important;
   -moz-border-bottom-colors: #000000 !important; -moz-border-left-colors: #000000  !important;
   -moz-appearance: none !important;
}

.Ulli

Zitat von MaximaleEleganz

CSS

menupopup, popup {
   -moz-appearance: none !important;
}

Dazu meint mozilla

Zitat von <woltlab-metacode-marker data-name=

-moz-appearance" data-link="">

-moz-appearance is used by mozilla browsers to display an element using a platform-native styling based on the operating system's theme.

Obiger Code schießt den aktuellen Stil ab. Sollte man also nicht ohne Warnung publizieren.

katzi

Zitat von MaximaleEleganz

CSS

menupopup, popup { 
   border: 1px solid !important;
   -moz-border-top-colors: #000000!important; -moz-border-right-colors: #000000 !important;
   -moz-border-bottom-colors: #000000 !important; -moz-border-left-colors: #000000  !important;
   -moz-appearance: none !important;
}

.Ulli hat Recht; ohne "-moz-appearance: none !important;" geht nichts und mit werden die ganzen Anzeigen der Popup-Menüs durcheinandergewirbelt, geht also auch nicht.

ciao
katzi (m)

MaximaleEleganz

Hier ohne Probleme.

ZweiVier

Zitat von katzi

.Ulli hat Recht; ohne "-moz-appearance: none !important;" geht nichts und mit werden die ganzen Anzeigen der Popup-Menüs durcheinandergewirbelt, geht also auch nicht.

Bist du dir da Sicher....

CSS

menupopup, popup {  border: 3px solid !important;
 -moz-border-top-colors: #ff0000!important; -moz-border-right-colors: #ff0000 !important;
 -moz-border-bottom-colors: #ff0000 !important; -moz-border-left-colors: #ff0000  !important;}

[Blockierte Grafik: http://www.abload.de/img/aufzeichnenfwn3.png] [Blockierte Grafik: http://www.abload.de/img/aufzeichnen21sky.png]

loshombre

Das kommt daher, weil ihr schon andere Codes bezüglich Popups am Start habt. Deswegen läuft dat auch so bei euch. Wenn dat aber nicht der Fall ist, wie wahrscheinlich bei katzi der Fall sein wird, ist Kamerad Ulli mit seiner These schon vorne.
Und seit 3er Fuchs nicht vergessen, die Unterscheidung zwischen Stylish und der Chrome.css gilt mehr denn je!