SOLVED: SVG css style width and height

Bugs
1

Bricks Version: 1.5.1
Browser: Chrome 90
OS: Windows

I am using Tailwind CSS, sometimes I copied made templates from third part websites and paste the code inside Code block. Most of the time the code contains SVG

<svg class="ml-2 w-5 h-5" fill="currentColor" viewBox="0 0 20 20" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z" clip-rule="evenodd"></path></svg>

The SVG size will inherit the CSS from bricks

[class*=brxe-] svg:not([width]) {
    min-width: 1em;
    width: inherit;
}

[class*=brxe-] svg:not([height]) {
    height: inherit;
    min-height: 1em;
}

image

I have also encountered this piece of code causing some issues

p:last-of-type {
    margin-bottom: 0;
}

Is there a way to overwrite on these codes or better remove them from the CSS code?

2

Hi Mohammed,
Welcome to the forum, and thanks for reaching out!

We’ll remove the SVG width & height inherit defaults in the upcoming version.
About p:last-of-type: What problems does it cause? Of course, you can override it (just like any other CSS property):

p:last-of-type {
margin-bottom: unset;
}

Best regards,
timmse