About Seiten mit CSS Codes anpassen

omar1979

Zuerst ein Dankeschön an alle Beteiligten.

Nachdem einige Änderungen vorgenommen habe möchte ich den auf dem Bild markierten Abstand verkleinern.

Habe selber einiges versucht, aber ohne Erfolg. Nun bitte ich um Hilfe.

Besten Dank.

Übrigens das ist die Code:

CSS

        /* AGENT_SHEET */
        @namespace url(http://www.w3.org/1999/xhtml);
        @-moz-document url("about:about") {
        
        html {background: #FFFFFF !important;}
        
        ul.columns {
        column-count: 3 !important;
        column-gap: 20px !important;
        margin: 0 !important;
        }
        
        .container > p:nth-child(2) > em:nth-child(1) {
        font-size: 0 !important;/*
        display: none !important;*/
        }

        .container > p:nth-child(2) > em:nth-child(1)::before {
        content: "Dies ist eine Liste der \"about:\"-Seiten, um Ihnen eine Übersicht zu geben."!important;
        font-family: Arial !important;
        font-style: normal !important;
        font-size: 19px !important;
        margin-left: -80px !important;
        margin-top: 10px !important;
        color: green !important;
        }
        /*
        #abouts {
        margin-top: 50px !important;
        }
        */
        body{ 
        background-color: #fffff0 !important;
        max-width: 1200px !important;
        min-height: 600px !important;
        height: auto !important; 
        margin-top: 5px !important;
        margin-bottom: 10px !important;
        margin-left: 80px !important;
        padding-top: 10px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  10px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        
        .container > h1:nth-child(1){
        margin-left: 150px !important;
        color: blue !important; 
        font-size: 24px !important; 
        font-weight: bold !important;}
        
        ul{list-style: none !important;}
                        
        #abouts{
        min-width: 1120px !important;
        background-color: #ffffff !important;
        margin-left: -200px !important;
        margin-top: 25px !important;
        padding-top: 15px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  15px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        p {margin-left: 160px !important; font-size:15px!important;}
        
        h1::before {
        content: "Ramo's Firefox:    "; 
        font-weight:bold !important;  
        color:red !important; 
        margin-left: 40px !important;}

        a{
        text-decoration:none!important;
        color:blue!important;}
    
        /* Breite der Schaltflächen */

        #abouts > li:nth-child(n+1){
        min-width: 170px !important;
        max-width: 170px !important;
        }
        
        /* Die ersten 14 */
        #abouts > li:nth-child(-n+14){
        appearance:none!important;
        background: #efefef url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:20px!important;
        margin-left: 55px !important;
        padding-right: 45px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die ersten 14 hover */

        #abouts > li:nth-child(-n+14):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
        
        
        /* Die mittleren 14 */

        #abouts > li:nth-child(n+15){
        appearance:none!important;
        background: #efffbf url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:5px!important;
        margin-left: 70px !important;
        padding-right: 25px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #79d279 !important;
        border-top-color:  #79d279 !important;
        border-right-color:  #009900 !important;
        border-bottom-color:  #009900 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die mittleren 14 hover */

        #abouts > li:nth-child(n+15):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
    
        
        /* Die letzten 14 */

        #abouts > li:nth-child(n+30){
        appearance:none!important;
        background: cornsilk url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:45px!important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #ffb2b2 !important;
        border-top-color:  #ffb2b2 !important;
        border-right-color:  #8d0000 !important;
        border-bottom-color:  #8d0000 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}

        /* Die letzten 14 hover */

        #abouts > li:nth-child(n+30):hover{
        appearance:none!important;
        background: #B2EDFA url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}            
        }

Alles anzeigen

grisu2099

Füge zu Zeile 78 hinzu:

max-height: 25px !important;

Den Wert kannst du dir dann ja nach deinen Wünschen anpassen...

2002Andreas

Zitat von omar1979

Abstand verkleinern.

In Zeile 65 den Wert auf ca.

margin-top: -30px !important;

setzen.

Dharkness

Zitat von 2002Andreas

Ich habe den Text oben etwas verkürzt.

Ich habe das so ↓ umgebaut.

CSS

div.container > p:nth-child(2) > em:nth-child(1) {
    display: none !important
}
div.container > p:nth-child(2)::after {
    content: "Dies ist eine Übersicht der vorhandenen about:Seiten."!important;
    font-style: normal !important;
    font-size: 16px !important;
    margin-left: 10px !important;
}

Das ↓ ist dann das Ergebnis.

2002Andreas

Zitat von Dharkness

Ich habe das so

Nur das Ergebnis zählt

Zitat von Dharkness

das Ergebnis.

Bei mir jetzt so:

Ich habe nur den Text verändert, keine Icons etc.

Dharkness

Zitat von 2002Andreas

Nur das Ergebnis zählt

In der Tat und so waren halt weniger zusätzliche Eingriffe nötig.

omar1979

Danke euch.

Und wie kann ich noch diese 2 Stellen kleiner machen?

Hab wieder selber versucht und nicht hingekriegt..

2002Andreas

Zitat von omar1979

diese 2 Stellen kleiner machen?

CSS

.container > h1:nth-child(1) {
    margin-top: -28px !important;
    margin-bottom: -15px !important;
 }

Die Werte musst du dir dann anpassen.

Zitat von omar1979

wieder selber versucht und nicht hingekriegt

Du gibst eben viel zu schnell auf

omar1979

Danke dort hat es geklappt aber das hat dazugefügt, dass diese Stelle zwischen den 2 blauen Ränder grösser wurde. hatte den vorher kleiner.

Zitat von 2002Andreas

Du gibst eben viel zu schnell auf

Nein eigentlich bin ich ein Stuurkopf der nicht schnell aufgibt, aber habe lange getestet.

FuchsFan

Zitat von omar1979

Nein eigentlich bin ich ein Stuurkopf der nicht schnell aufgibt, aber habe lange getestet.

Dann wohl doch überhastet. Hat Andreas doch recht?

So dann probiere mal bitte, sieht dann so aus mit deinem Code:

CSS

        /* AGENT_SHEET */
        @namespace url(http://www.w3.org/1999/xhtml);
        @-moz-document url("about:about") {
        
        html {background: #FFFFFF !important;}
        
        ul.columns {
        column-count: 3 !important;
        column-gap: 20px !important;
        margin: 0 !important;
        }
        
        .container > h1:nth-child(1) {
    margin-top: -5px !important;
    
 }
        
        .container > p:nth-child(2) > em:nth-child(1) {
        font-size: 0 !important;/*
        display: none !important;*/
        }

        .container > p:nth-child(2) > em:nth-child(1)::before {
        content: "Dies ist eine Liste der \"about:\"-Seiten, um Ihnen eine Übersicht zu geben."!important;
        font-family: Arial !important;
        font-style: normal !important;
        font-size: 19px !important;
        margin-left: -80px !important;
        margin-top: -5px !important;
        color: green !important;
        }
        /*
        #abouts {
        margin-top: 50px !important;
        }
        */
        body{ 
        background-color: #fffff0 !important;
        max-width: 1200px !important;
        min-height: 600px !important;
        height: auto !important; 
        margin-top: 5px !important;
        margin-bottom: 10px !important;
        margin-left: 80px !important;
        padding-top: 10px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  10px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        
        .container > h1:nth-child(1){
        margin-left: 150px !important;
        color: blue !important; 
        font-size: 24px !important; 
        font-weight: bold !important;}
        
        ul{list-style: none !important;}
                        
        #abouts{
        min-width: 1120px !important;
        background-color: #ffffff !important;
        margin-left: -200px !important;
        margin-top: -45px !important;
        padding-top: 15px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  15px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        p {margin-left: 160px !important; font-size:15px!important;}
        
        h1::before {
        content: "Ramo's Firefox:    "; 
        font-weight:bold !important;  
        color:red !important; 
        margin-left: 40px !important;}

        a{
        text-decoration:none!important;
        color:blue!important;}
    
        /* Breite der Schaltflächen */

        #abouts > li:nth-child(n+1){
        min-width: 170px !important;
        max-width: 170px !important;
        }
        
        /* Die ersten 14 */
        #abouts > li:nth-child(-n+14){
        appearance:none!important;
        background: #efefef url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:20px!important;
        margin-left: 55px !important;
        padding-right: 45px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die ersten 14 hover */

        #abouts > li:nth-child(-n+14):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
        
        
        /* Die mittleren 14 */

        #abouts > li:nth-child(n+15){
        appearance:none!important;
        background: #efffbf url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:5px!important;
        margin-left: 70px !important;
        padding-right: 25px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #79d279 !important;
        border-top-color:  #79d279 !important;
        border-right-color:  #009900 !important;
        border-bottom-color:  #009900 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die mittleren 14 hover */

        #abouts > li:nth-child(n+15):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
    
        
        /* Die letzten 14 */

        #abouts > li:nth-child(n+30){
        appearance:none!important;
        background: cornsilk url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:45px!important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #ffb2b2 !important;
        border-top-color:  #ffb2b2 !important;
        border-right-color:  #8d0000 !important;
        border-bottom-color:  #8d0000 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}

        /* Die letzten 14 hover */

        #abouts > li:nth-child(n+30):hover{
        appearance:none!important;
        background: #B2EDFA url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}            
        }

Alles anzeigen

2002Andreas

Ich musste in Zeile 40 den Wert von 600 auf 500 ändern für diese Ansicht:

CSS

        /* AGENT_SHEET */
        @namespace url(http://www.w3.org/1999/xhtml);
        @-moz-document url("about:about") {
        
        html {background: #FFFFFF !important;}
        
        ul.columns {
        column-count: 3 !important;
        column-gap: 20px !important;
        margin: 0 !important;
        }
        
        .container > h1:nth-child(1) {
    margin-top: -5px !important;
    
 }
        
        .container > p:nth-child(2) > em:nth-child(1) {
        font-size: 0 !important;/*
        display: none !important;*/
        }

        .container > p:nth-child(2) > em:nth-child(1)::before {
        content: "Dies ist eine Liste der \"about:\"-Seiten, um Ihnen eine Übersicht zu geben."!important;
        font-family: Arial !important;
        font-style: normal !important;
        font-size: 19px !important;
        margin-left: -80px !important;
        margin-top: -5px !important;
        color: green !important;
        }
        /*
        #abouts {
        margin-top: 50px !important;
        }
        */
        body{ 
        background-color: #fffff0 !important;
        max-width: 1200px !important;
        min-height: 500px !important;
        height: auto !important; 
        margin-top: 5px !important;
        margin-bottom: 10px !important;
        margin-left: 80px !important;
        padding-top: 10px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  10px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        
        .container > h1:nth-child(1){
        margin-left: 150px !important;
        color: blue !important; 
        font-size: 24px !important; 
        font-weight: bold !important;}
        
        ul{list-style: none !important;}
                        
        #abouts{
        min-width: 1120px !important;
        background-color: #ffffff !important;
        margin-left: -200px !important;
        margin-top: -45px !important;
        padding-top: 15px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  15px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        p {margin-left: 160px !important; font-size:15px!important;}
        
        h1::before {
        content: "Ramo's Firefox:    "; 
        font-weight:bold !important;  
        color:red !important; 
        margin-left: 40px !important;}

        a{
        text-decoration:none!important;
        color:blue!important;}
    
        /* Breite der Schaltflächen */

        #abouts > li:nth-child(n+1){
        min-width: 170px !important;
        max-width: 170px !important;
        }
        
        /* Die ersten 14 */
        #abouts > li:nth-child(-n+14){
        appearance:none!important;
        background: #efefef url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:20px!important;
        margin-left: 55px !important;
        padding-right: 45px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die ersten 14 hover */

        #abouts > li:nth-child(-n+14):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
        
        
        /* Die mittleren 14 */

        #abouts > li:nth-child(n+15){
        appearance:none!important;
        background: #efffbf url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:5px!important;
        margin-left: 70px !important;
        padding-right: 25px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #79d279 !important;
        border-top-color:  #79d279 !important;
        border-right-color:  #009900 !important;
        border-bottom-color:  #009900 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die mittleren 14 hover */

        #abouts > li:nth-child(n+15):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
    
        
        /* Die letzten 14 */

        #abouts > li:nth-child(n+30){
        appearance:none!important;
        background: cornsilk url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:45px!important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #ffb2b2 !important;
        border-top-color:  #ffb2b2 !important;
        border-right-color:  #8d0000 !important;
        border-bottom-color:  #8d0000 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}

        /* Die letzten 14 hover */

        #abouts > li:nth-child(n+30):hover{
        appearance:none!important;
        background: #B2EDFA url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}            
        }

Alles anzeigen

omar1979

Zitat von FuchsFan

Dann wohl doch überhastet. Hat Andreas doch recht?

Ich werde nur nervös wenn was nach vielen versuchen nicht kann.

Kann ich fragen was du bei dieser Code neu gemacht hast? Ich will den Abstand zwischen dem Obersten Titel und dem Text kleiner machen. Und den untersten Abstand zwischen den 2 Ränder auch noch.

Danke dir.

omar1979

2002Andreas wenn ich mit dieser Code diesen Wert auf 500 setze, siehts wie das Bild aus.

und hier die Code.

CSS

        /* AGENT_SHEET */
        @namespace url(http://www.w3.org/1999/xhtml);
        @-moz-document url("about:about") {
        
        html {background: #FFFFFF !important;}
        
        ul.columns {
        column-count: 3 !important;
        column-gap: 20px !important;
        margin: 0 !important;
        }
        
        .container > p:nth-child(2) > em:nth-child(1) {
        font-size: 0 !important;
        }

        .container > p:nth-child(2) > em:nth-child(1)::before {
        content: "Dies ist eine Liste der \"about:\"-Seiten, um Ihnen eine Übersicht zu geben."!important;
        font-family: Arial !important;
        font-style: normal !important;
        font-size: 17px !important;
        margin-left: -80px !important;
        margin-top: -10px !important;
        color: green !important;
        }

        body{ 
        background-color: #fffff0 !important;
        max-width: 1200px !important;
        min-height: 550px !important;
        height: auto !important; 
        margin-top: 5px !important;/*
        margin-bottom: 5px !important;*/
        margin-left: 80px !important;
        padding-top: 5px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  5px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        .container > h1:nth-child(1) {
        margin-top: -40px !important;
        margin-bottom: -15px !important;}
        
        .container > h1:nth-child(1){
        margin-left: 150px !important;
        color: blue !important; 
        font-size: 22px !important; 
        font-weight: bold !important;}
        
        ul{list-style: none !important;}
                        
        #abouts{
        min-width: 1120px !important;
        background-color: #ffffff !important;
        margin-left: -200px !important;
        margin-top: -50px !important;
        margin-bottom: 5px !important;
        padding-top: 10px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  10px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}
        
        p {margin-left: 160px !important; font-size:15px!important;}
        
        h1::before {
        content: "Ramo's Firefox:    "; 
        font-weight:bold !important;  
        color:red !important;
        margin-left: 40px !important;}

        a{
        text-decoration:none!important;
        color:blue!important;}
    
        /* Breite der Schaltflächen */

        #abouts > li:nth-child(n+1){
        min-width: 170px !important;
        max-width: 170px !important;
        }
        
        /* Die ersten 14 */
        #abouts > li:nth-child(-n+14){
        appearance:none!important;
        background: #efefef url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:20px!important;
        margin-left: 55px !important;
        padding-right: 45px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die ersten 14 hover */

        #abouts > li:nth-child(-n+14):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
        
        
        /* Die mittleren 14 */

        #abouts > li:nth-child(n+15){
        appearance:none!important;
        background: #efffbf url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:5px!important;
        margin-left: 70px !important;
        padding-right: 25px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #79d279 !important;
        border-top-color:  #79d279 !important;
        border-right-color:  #009900 !important;
        border-bottom-color:  #009900 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}


        /* Die mittleren 14 hover */

        #abouts > li:nth-child(n+15):hover{
        appearance:none!important;
        background: #B2EDFA  url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}
    
        
        /* Die letzten 14 */

        #abouts > li:nth-child(n+30){
        appearance:none!important;
        background: cornsilk url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:45px!important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #ffb2b2 !important;
        border-top-color:  #ffb2b2 !important;
        border-right-color:  #8d0000 !important;
        border-bottom-color:  #8d0000 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}

        /* Die letzten 14 hover */

        #abouts > li:nth-child(n+30):hover{
        appearance:none!important;
        background: #B2EDFA url("..//favicons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        border-radius:14px!important;}            
        }

Alles anzeigen

Habs auch mit 550 getestet.. nicht viel besser..

wenn 600 habe dort, ist der obere Teil gut.

nur der untere Teil hat einen grossen Abstand.

Zitat von 2002Andreas

Ich musste in Zeile 40 den Wert von 600 auf 500 ändern für diese Ansicht:

Bei deinem Code oben sieht das so aus.

Da wird der untere Abstand kleiner aber der Abstand oben wird grösser.

omar1979

ehm.. Hat das vielleicht mit der Bildschirm-Auslösung zu tun?

weiss zwar nichtmal wo ich schauen kann was für eine Bildschirm-Auflösung ich habe.

Dharkness

Hm,

ich frage mich gerade, warum in dem ↓ Abschnitt überhaupt ein Wert für die Höhe gesetzt wird, in meinem CSS für about:about gibt es keine Höhenanpassung.

CSS

        body{ 
        background-color: #fffff0 !important;
        max-width: 1200px !important;
        min-height: 550px !important;
        height: auto !important; 
        margin-top: 5px !important;/*
        margin-bottom: 5px !important;*/
        margin-left: 80px !important;
        padding-top: 5px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  5px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-radius: 20px !important;
        border-width:  4px !important;
        border-style: outset !important;}

Alles anzeigen

Hier mal mein CSS für about:about.

CSS

@-moz-document url("about:about") {
div.container {
    border: 2px solid #B2B2B2 !important;
    background-color: #2A2A2E !important;
}
div.container h1 {
    font-size: 1.8em !important;
    border-bottom: 2px solid #B2B2B2 !important;
    background-color: #2A2A2E !important;
    color: #FFF !important;
    padding: 2px 8px !important;
    margin-bottom: 0 !important;
}
div.container > p {
    border-bottom: 2px solid #B2B2B2 !important;
    background-color: #2A2A2E !important;
    padding: 2px 5px 5px 5px !important;
    margin: 0 !important;
}
div.container > p > em {
    font-style: normal !important;
    font-size: 14px !important;
    color: #FFF !important;
    padding: 2px 0 !important;
}

div.container > p:nth-child(2) > em:nth-child(1) {
    display: none !important
}
div.container > p:nth-child(2)::after {
    content: "Dies ist eine Übersicht der vorhandenen about:Seiten."!important;
    font-style: normal !important;
    font-size: 16px !important;
    margin-left: 10px !important;
}

ul.columns {
    column-count: 3 !important;
    column-gap: 10px !important;
    margin: 20px 10px !important;
}
ul {
    list-style: none !important;
}
ul > li {
    border: 2px solid #B2B2B2 !important;
    background-color: #2A2A2E !important;
}
ul > li > a {
    text-decoration: none !important;
    color: #FFF !important;
    padding: 1px 8px !important;
    padding-left: 35px !important;
}
ul > li:hover {
    background-color: #D1E2F2 !important;
}
ul > li:hover > a {
    text-decoration: none !important;
    color: #000 !important;
}

#abouts > li > a {
    min-width: 182px !important;
    max-width: 182px !important;
    display: block !important;
}

#abouts > li {
    -moz-appearance: none !important;
    display: block !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    border: 1px solid #B2B2B2 !important;
    background: #4E4E54 url("..//chrome/icons/Bild3.png") no-repeat !important;
    background-position: 10px 2px !important;
    color: transparent !important;
    padding-top: 1px !important;
    padding-right: 0 !important;
    padding-bottom: 2px !important;
    padding-left: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 5px !important;
    margin-right: 10px !important;
    margin-left: 10px !important;
}
#abouts > li:hover {
    -moz-appearance: none !important;
    display: block !important;
    font-size: 14px !important;
    text-decoration: none !important;
    border-radius: 0 !important;
    border: 1px solid #B2B2B2 !important;
    background: #D1E2F2 url("..//chrome/icons/Bild3.png") no-repeat !important;
    background-position:10px 2px!important;
    color: #000 !important;
    padding-top: 1px !important;
    padding-right: 0 !important;
    padding-bottom: 2px !important;
    padding-left: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 5px !important;
    margin-right: 10px !important;
    margin-left: 10px !important;
}

#abouts > li:nth-child(5), /* about:certifikate */
#abouts > li:nth-child(8), /* about:config */
#abouts > li:nth-child(9), /* about:crashes */
#abouts > li:nth-child(16), /* about:logins */
#abouts > li:nth-child(21), /* about:networking */
#abouts > li:nth-child(23), /* about:performance */
#abouts > li:nth-child(34), /* about:serviceworkers */
#abouts > li:nth-child(37), /* about:sync */
#abouts > li:nth-child(41) /* about:unloads */ {
    -moz-appearance: none !important;
    border-radius: 0 !important;
    display: block !important;
    font-size: 14px !important;
    border-color: #B2B2B2 !important;
    border-style: solid !important;
    border-width: 1px !important;
    background: #0082FC url("..//chrome/icons/Bild3.png") no-repeat !important;
    background-position: 10px 2px !important;
    color: #000 !important;
    padding-top: 1px !important;
    padding-right: 0 !important;
    padding-bottom: 2px !important;
    padding-left: 0 !important;
}
#abouts > li:nth-child(5):hover,
#abouts > li:nth-child(8):hover,
#abouts > li:nth-child(9):hover,
#abouts > li:nth-child(16):hover,
#abouts > li:nth-child(21):hover,
#abouts > li:nth-child(23):hover,
#abouts > li:nth-child(34):hover,
#abouts > li:nth-child(37):hover,
#abouts > li:nth-child(41):hover {
    -moz-appearance: none !important;
    border-radius: 0 !important;
    display: block !important;
    font-size: 14px !important;
    border-color: #B2B2B2 !important;
    border-style: solid !important;
    border-width: 1px !important;
    background: #D1E2F2 url("..//chrome/icons/Bild3.png") no-repeat !important;
    background-position: 10px 2px !important;
    color: #000 !important;
    padding-top: 1px !important;
    padding-right: 0 !important;
    padding-bottom: 2px !important;
    padding-left: 0 !important;
}
}

Alles anzeigen

omar1979

Zitat von Dharkness

in dem ↓ Abschnitt überhaupt ein Wert für die Höhe gesetzt wird,

Weil es der Coder so gemacht hat.

Zitat von Dharkness

mein CSS für about:about.

Hast du auch ein Bild wie es aussieht?

Danke dir.

Dharkness

So ↓ sieht es hier aus.

omar1979

Zitat von Dharkness

So ↓ sieht es hier aus.

Danke. Ich teste es mal bei gelegenheit bei mir.

FuchsFan

Zitat von omar1979

Kann ich fragen was du bei dieser Code neu gemacht hast?

Das kann ich dir jetzt auch nicht sagen, wenn du es genau wissen willst, dann lege in notepad beide Codes nebeneinander und vergleiche die Werte.

Und Dharkness hat dir ja hier RE: About Seiten mit CSS Codes anpassen auch eine Vorlage geliefert, aus der du viele Sachen entnehmen kannst.

Und wenn du möchtest, dann lege ich auch noch mal nach, du hast also volle Auswahl.

CSS

        /* AGENT_SHEET */
        @namespace url(http://www.w3.org/1999/xhtml);
        @-moz-document url("about:about") {
        
        html {background: gainsboro !important;}
        
        ul.columns {
        column-count: 3 !important;
        column-gap: 20px !important;
        margin: 0 !important;
        }
        
        body{ 
        background-color: #fffff0 !important;
        max-width: 920px !important;
        min-height: 600px !important;
        height: auto !important; 
        margin-top: 20px !important;
        margin-bottom: 30px !important;
        margin-left: 300px !important;
        padding-top: 45px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  65px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        /* border-radius: 20px !important; */
        border-width:  10px !important;
        box-shadow: 15px 15px 0px 0px #fdd342 inset !important;
        border-style: double  /* outset */ !important;}
        
        
        .container > h1:nth-child(1){
        margin-left: 5px !important;
        color: blue !important; 
        font-size: 24px !important; 
        font-weight: bold !important;}
        
        ul{list-style: none !important;}
        
        #abouts{
        max-width: 700x !important;
        background-color: #f8f8ff !important;
        margin-left: 0px !important;
        margin-top: 25px !important;
        padding-top: 25px !important;
        padding-left: 25px !important;
        padding-right: 25px !important;
        padding-bottom:  25px !important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        /* border-radius: 20px !important; */
        border-width:  4px !important;
        border-style: outset !important;}
        
        p {margin-left: 160px !important; font-size:15px!important;}
        
        div.container > p:nth-child(2) > em:nth-child(1) {
        display: none !important
        }
        div.container > p:nth-child(2)::after {
        content: "Dies ist eine Übersicht der vorhandenen about:Seiten."!important;
        color: royalblue !important;
        font-style: italic !important;
        font-size: 17px !important;
        margin-left: -156px !important;
        }
        
       /*  h1::before {
        content: "about: Übersichtsliste    "; 
        font-weight:700 !important;  
        color: blue !important; 
        margin-left: 80px !important;} */

        a{
        text-decoration:none!important;
        color:black!important;}
    
        /* Breite der Schaltflächen */

        #abouts > li:nth-child(n+1){
        min-width: 150px !important;
        max-width: 150px !important;
        }
        
        /* Die ersten 14 */
        #abouts > li:nth-child(-n+15){
        appearance:none!important;
        background: #e9effd /* #efefef */ url("..//icons/about.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:20px!important;
        margin-left: 0px !important;
        padding-right: 25px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  lightblue!important;
        border-top-color:  lightblue!important;
        border-right-color:  dodgerblue!important;
        border-bottom-color:  dodgerblue!important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        /* border-radius:14px!important; */}


        /* Die ersten 14 hover */

        #abouts > li:nth-child(-n+14):hover{
        appearance:none!important;
        background: gold  url("..//icons/about.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        /* border-radius:14px!important; */}
        
        
        /* Die mittleren 14 */

        #abouts > li:nth-child(n+15){
        appearance:none!important;
        background: #fdf9f1 url("..//icons/about3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-right:5px!important;
        margin-left: 6px !important;
        padding-right: 25px !important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #79d279 !important;
        border-top-color:  #79d279 !important;
        border-right-color:  #009900 !important;
        border-bottom-color:  #009900 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        /* border-radius:14px!important; */}


        /* Die mittleren 14 hover */

        #abouts > li:nth-child(n+15):hover{
        appearance:none!important;
        background: gold url("..//icons/about3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        text-decoration:none!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        /* border-radius:14px!important; */}
    
        
        /* Die letzten 14 */

        #abouts > li:nth-child(n+30){
        appearance:none!important;
        background: cornsilk url("..//icons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        margin-top:3px!important;
        margin-bottom: 5px !important;
        margin-leftt:15px!important;
        padding-left:40px!important;
        padding-top: 1px!important;
        padding-bottom: 2px!important;
        border-left-color:  #ffb2b2 !important;
        border-top-color:  #ffb2b2 !important;
        border-right-color:  #8d0000 !important;
        border-bottom-color:  #8d0000 !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        /* border-radius:14px!important; */}

        /* Die letzten 14 hover */

        #abouts > li:nth-child(n+30):hover{
        appearance:none!important;
        background: gold url("..//icons/Bild3.png")no-repeat !important;
        color:transparent!important;
        font-size:14px!important;
        border-left-color:  #bbddff !important;
        border-top-color:  #bbddff !important;
        border-right-color:  #11508d !important;
        border-bottom-color:  #11508d !important;
        border-style: outset !important;
        border-width:2px !important;
        background-position:14px 2px!important;
        /* border-radius:14px!important; */}            
        }

Alles anzeigen

FuchsFan

Hinweis:

Im aktuellen Nightly sind Anpassungen bei about:profiles fällig.

Im Code sind dafür zwei Einträge zu ändern, und zwar von #action-box in .action-box.

About Seiten mit CSS Codes anpassen

Ähnliche Themen

Mehrzeilige Tableiste für aktuelle Firefox-Versionen

Addons Manager Nightly