SVG in Pro Header Builder

[zedinho]

Hey guys,

This is more of a feedback / feature request than a question.

Usually, I’m using SVG’s rather than images in my navigation bars to display the website logo by adding the SVG code into a “Content Area” element. This works, but since the code has to be placed into that element, some custom CSS is required to ensure correct rendering of the SVG (especially in Firefox).

It took me a long time, but eventually I figured out that adding the following code to the “Content Area” with the SVG code provides the best results in the browsers I tested:

$el {
  width: 100%;
  height: 100%;
}

$el svg {
  display: block;
}

Without this code, the SVG is not always rendered correctly.

So, as I said, this works fine. However, it is not required for the SVG inline code to be nested within the “Content Area” element. If we were able to add the SVG code directly inside the parent container, the results would be more compatible and everything would be easier.

What’s missing is a “SVG Inline Code” or “RAW HTML Code” element that doesn’t wrap an extra div around the content.

[basanta]

Hi There,

Thanks for your suggestion!
we understand your concern, how ever any element needs a container DIV.
Without container it can’t manage or place any where. As per now for header builder the content area and for content builder classic raw element is the best option with the suggested CSS that you have mentioned.

we will consider as a feature request for future release.

Thanks