Programmiererforum

// Test 1
figure {
margin-inline-start: 0;
margin-inline-end: 0;
}

// Test 2
.prose figure {
margin: 0;
border: 1px red solid; //TEST
}

// Test 3
.prose figure.wp-block-image {
margin: 0;
}

// Test 4
div.prose figure.wp-block-image {
margin-inline-start: 0 !important;
margin-inline-end: 0 !important;
border: 1px green solid; //TEST
}
< /code>
Ich habe das folgende < /p>
[list]
  Das Stylesheet ansonsten übergeht, um das Styling wie das vorgestellte Bild zu erreichen. Willst du es, indem es einfach einen Zurücksetzen auf global.css durch addding figure {margin: 0; } 

Ziel
Das Bild in voller Breite des Containers anzuzeigen. Und dies erzwingt auf jeder Seite einen Abstand von 40px. Ich habe verschiedene Dinge in [b] blogpost.astro [/b] einschließlich einiger Dinge versucht, die nicht Best Practice sind:
[code]// Test 1
figure {
margin-inline-start: 0;
margin-inline-end: 0;
}

// Test 2
.prose figure {
margin: 0;
border: 1px red solid; //TEST
}

// Test 3
.prose figure.wp-block-image {
margin: 0;
}

// Test 4
div.prose figure.wp-block-image {
margin-inline-start: 0 !important;
margin-inline-end: 0 !important;
border: 1px green solid; //TEST
}
< /code>
Ich habe das folgende < /p>
[list]
Das Stylesheet ansonsten übergeht, um das Styling wie das vorgestellte Bild zu erreichen. Willst du es, indem es einfach einen Zurücksetzen auf global.css durch addding figure {margin: 0; } [/code], aber dies lässt mich überrascht, warum ich das in der Datei [b] blogpost.astro [/b] nicht auf diese Komponente abzielen kann. /> [/list]