userContent.CSS | Seitenbreite von Webseiten & Domains immer auf 100% (Monitorbreite) strecken

Mira_Belle

Nachtrag.

Kann bitte nochmal jemand über den Code für ComputerBase schauen?

CSS

@-moz-document domain("computerbase.de") {
    #content {
        margin-left: 100px !important;
        width: 80em !important;
    }
    .wrapper  {
        margin-left: 100px !important;

    }
    .row-main {
        width: 35em !important;
    }
    .homepage-link {
        margin-left: 100px !important;
    }
    .headermeta {
        left: 870px !important;
        right: -150px !important;
    }        
}

Alles anzeigen

Dürfte in der Mitte etwas breiter und mittiger sein.

Ich bekomme es einfach nicht hin.

Mit diesem Code wird die Seite im übrigen IMMER wie "gewünscht" angezeigt.

Bisher hatte ich immer den Fehler, dass erst der Code ignoriert oder "falsch" interpretiert wurde

und erst nach einem Reload der Code (richtig) verarbeitet wurde.

Und hier das Bildchen dafür.

Sören Hentzschel

CSS

.wrapper  {
    margin-left: 100px !important;
}

Der Teil ist Schuld, dass der Inhalt nicht mittig ist. Entferne das wieder und der Inhalt wird auch mittig dargestellt. Wenn es dir noch nicht breit genug ist, musst du diesem Element eben auch eine höhere Breite zuweisen, z.B.

CSS

.wrapper {
    width: 70em !important;
}

Mira_Belle

Danke Sören Hentzschel

So einfach kann es doch sein,

wenn man weiß, was man macht.

Mit Deinem Hinweis ist nun dies herausgekommen.

CSS

@-moz-document domain("computerbase.de") {
    #content {
        margin-left: 100px !important;
        width: 80em !important;
    }
    .wrapper  {
        width: 70em !important;

    }
    .row-main {
        width: 45em !important;
    }        
}

Alles anzeigen

Kompakt und für mich perfekt.

Danke.

Nachtrag!

Und wird oft nur nach einem Reload geladen. Grrrrr.

Warum?

milupo

Zitat von Mira_Belle

Und wird oft nur nach einem Reload geladen. Grrrrr.
Warum?

Weil du bisher immer etwas geändert hast. Wenn du jetzt eine Endfassung hast, brauchst du das nicht mehr. Firefox kennt ja deine Änderungen nicht, die stehen ja erst einmal nur lokal in deinem Editor zur Verfügung. Das ist ähnlich, wie wenn du Systemeinstellungen von Windows veränderst, dann musst du Windows neu starten.

2002Andreas

Zitat von Mira_Belle

nur nach einem Reload geladen.

Wie testest du denn deine veränderten Codes?

Wenn du das gleich in den Entwicklerwerkzeugen machst, dann wird dir jede Änderung/Anpassung sofort angezeigt.

Und wenn alles passt, dann kopierst du den Code aus den Entwicklerwerkzeugen und fügst ihn in die userContent.css ein.

Und erst dort musst du dann die @-moz- Regel für die jeweilige Seite hinzufügen, nicht schon in den Entwicklerwerkzeugen.

Mira_Belle

Ich gehe genau so, wie von Dir beschrieben, vor!

Zitat von 2002Andreas

Wie testest du denn deine veränderten Codes?

Ich gehe genau so, wie von Dir beschrieben, vor!

Und genau deshalb verstehe ich nicht, warum ausgerechnet "nur" der Code

für "computerbase.de" nicht gleich und richtig verarbeitet wird.

CSS

::selection {
  color: white !important; 
  background: #ff8000 !important;
}

@-moz-document domain("computerbase.de") {
    #content {
        margin-left: 100px !important;
        width: 80em !important;
    }
    .wrapper  {
        width: 70em !important;
    }
    .row-main {
        width: 45em !important;
    }        
}


@-moz-document domain("chip.de") {
    .Portal {
        --topbanner-height-min: 0 !important;
    }
    :root {
        --breakpoint-desktop: 80vw !important;
    }
    #widget-entry-filter {
        display: none !important;
    } 
    #G32 {	margin-left: 120px !important;    }
}

@-moz-document domain("drwindows.de") {
    main .p-body-inner {
        padding:0 calc((100vw - var(--content-width)) / 8)!important;
    }
}

@-moz-document domain("www.supernature-forum.de") {
    .p-body-inner {
        max-width:100% !important;
    }
}

@-moz-document domain("heise.de") {
    .a-layout {
        max-width: 75rem !important;
    }
}

@-moz-document domain("borncity.com") {
    #site-description {
        width: 100% !important;
    }
    #wrapper {
        width: 78% !important;
    }
    #access {
        padding-left: 120px !important; 
        width: 90% !important;
    }        
    #main {
        padding-top: 0px !important; 
        padding-right: 200px !important;
    }
    #primary {
        margin-right: -185px !important;
        width: 250px !important;
    }
    #content {
        width: 790px !important;
    }
}

@-moz-document domain("winfuture.de") {
    #mainWrap {
        width: 95% !important;
        margin-left: 35px !important;
    }
    .headerR {
        width:71% !important;
        margin-left: -6px !important;
    }
    #topnavi {
        width:98% !important;
    }
    .header_login a.logout, .header_login a.register {
        margin-right: 80px !important;
    }
    #centerWrap {
        margin-left: -295px !important;
        width: 950px !important;
    }
    .primary_content {
        margin-left: 1px !important;
        width: 700px !important;
    }
    #header .navigation {
        border-bottom: 1px solid lightblue !important;
        opacity: .7 !important;  
    }
    .content_wrap {
          width: 850px !important;
    }
    .primary_content {
        margin-left: 55px !important;
        width: 860px !important;
  }      
}

@-moz-document domain("golem.de") {
    #header {
        width: 1200px !important; 
    }
    #gservices {
        width: 1200px !important; 
    }
    #screen {
        width: 1200px !important; 
    }
    #iqadtile3 {
        display: none !important; 
    }
    #iqadtile5 {
        display: none !important; 
    }
    .li-hb-academy {
        display: none !important; 
    }
    .li-hb-phits {
        display: none !important; 
    }

    .g2 {
        margin-left: 80px !important; 
    }
    .g4 {
    width: 760px !important; 
    
    }
    #grandwrapper {
        width: 1150px !important; 
    }
    .li-reset {
    display: none !important; 
    }

Alles anzeigen

Das ist die komplette von mir verwendete userContent.css.

milupo

Zitat von Mira_Belle

Das ist die komplette von mir verwendete userContent.css.

Ganz am Ende fehlt noch eine schließende geschweifte Klammer (für golem.de).

Mira_Belle

Zitat von milupo

Ganz am Ende fehlt noch eine schließende geschweifte Klammer (für golem.de).

Danke, ist korrigiert.

Ändert aber nichts am Verhalten beim Aufrufen von "computerbase.de".

.DeJaVu

CSS

@-moz-document domain("computerbase.de") {
.wrapper
{
    width: 80em !important;
}

.row-main
{
    width: calc(100% - 340px) !important;
}

}

Alles anzeigen

Mira_Belle

Zitat von .DeJaVu

CSS

@-moz-document domain("computerbase.de") {
.wrapper
{
    width: 80em !important;
}

.row-main
{
    width: calc(100% - 340px) !important;
}

}

Alles anzeigen

Danke .DeJaVu.

Es ändert sich .... nix am Verhalten. Leider.

Weiß der Kuckuck woran es liegt.

.DeJaVu

Ich denke, ich hab da eine/die Idee.

CSS

@-moz-document domain("computerbase.de") {
.wrapper
{
    width: 80em !important;
}

.row-main
{
    width: calc(100% - 340px) !important;
}

.block1
{
    padding: 0 !important;
}

}

Alles anzeigen

Beim Cookie Consent ist es noch linksbündig, danach auch, neu laden ändert aber genau diesen Wert hier, warum auch immer.

Mira_Belle

Super, klasse.

.DeJaVu Du bist ja doch nicht so ein Brummbär!

Danke.

Könntest Du mir noch bei einer unschönen Sache helfen?

Winfuture!

Da ist mein Code zu einem Roman mutiert,

aber er funktioniert,

solange man nicht auf bestimmte Unterseiten kommt.

Grrr.

Also, die Startseite, aber auch die Artikel selber,

werden so angezeigt, wie von mir gewünscht.

Klicke ich aber auf Download und dann z.B. auf

https://winfuture.de/downloadvorschalt,3040.html,

oh graus!

Hier der Code, der Roman

CSS

@-moz-document domain("winfuture.de") {
    #mainWrap {
        width: 95% !important;
        margin-left: 35px !important;
    }
    .headerR {
        width:71% !important;
        margin-left: -6px !important;
    }
    #topnavi {
        width:98% !important;
    }
    .header_login a.logout, .header_login a.register {
        margin-right: 80px !important;
    }
    #centerWrap {
        margin-left: -295px !important;
        width: 950px !important;
    }
    .primary_content {
        margin-left: 1px !important;
        width: 700px !important;
    }
    #header .navigation {
        border-bottom: 1px solid lightblue !important;
        opacity: .7 !important;  
    }
    .content_wrap {
          width: 850px !important;
    }
    .primary_content {
        margin-left: 55px !important;
        width: 860px !important;
  }      
}

Alles anzeigen

Kann man denn, für jene Uunterseiten" eigene CSS anlegen?

2002Andreas

Zitat von Mira_Belle

Kann man denn, für jene Uunterseiten" eigene CSS anlegen?

Ja, jeweils mit anderer Bezeichnung.

Beispiel unser Forum:

Code

Das ganze Forum:


@-moz-document domain("www.camp-firefox.de") {


Nur die Startseite:


@-moz-document url(https://www.camp-firefox.de/forum/) {


Nur die erste Seite im Unterforum Allgemein:


@-moz-document url(https://www.camp-firefox.de/forum/forum/15-firefox-allgemein/) {

Alle Unterseiten im Unterforum Allgemein:


@-moz-document url-prefix(https://www.camp-firefox.de/forum/forum/15-firefox-allgemein/) {

Alles anzeigen

Der Unterschied ist:

Domain

url

url-prefix

Mira_Belle

Danke 2002Andreas,

aber es hat mir keine Ruhe gelassen und ich habe eine Lösung gefunden.

UND, der Code ist auch noch geschrumpft und jetzt viel übersichtlicher.

CSS

@-moz-document domain("winfuture.de") {
    #mainWrap {
        width: 95% !important;
        margin-left: 35px !important;
    }
    .headerR {
        width:71% !important;
        margin-left: -6px !important;
    }
    #topnavi {
        width:98% !important;
    }

    #header .navigation {
        border-bottom: 1px solid lightblue !important;
        opacity: .7 !important;  
    }

    #centerLeftWrap {
    padding-right: 120px !important;
    }
    #centerRightWrap {
    padding-right: 120px !important;
    }
}

Alles anzeigen

Zitat von 2002Andreas

Zitat von Mira_Belle

Kann man denn, für jene Unterseiten" eigene CSS anlegen?

Ja, jeweils mit anderer Bezeichnung.
Beispiel unser Forum:
...
Der Unterschied ist:
Domain
url
url-prefix

Alles anzeigen

Und wenn die Startseite schon wie hier "winfuture.de" ist?

2002Andreas

Zitat von Mira_Belle

Und wenn die Startseite

Wenn es NUR die Startseite betreffen soll:

Code

@-moz-document url(https://winfuture.de/) {

2002Andreas

Sieht dann so aus auf der Startseite:

Und so auf einer Unterseite:

Mira_Belle

Zitat von 2002Andreas

Sieht dann so aus auf der Startseite:
Und so auf einer Unterseite:

Ach so!! Wieder was gelernt.

Danke 2002Andreas.

2002Andreas

Zitat von Mira_Belle

Wieder was gelernt.

Freut mich.