Image figure tag


#1

Hi there,

I want to avoid to many inline styles. Is there a way to get rid of the figure tag?

When not 2 things:

Here an example what is not needed with the current style when I align a image e. g. to float right:
margin: 0px 0px 10px 10px;

I try to not use more chars inside a html or css than needed and I want spelling like this:
margin: 0 0 10px 10px;

Is this manageable with a change of code somewhere?

I know that I can do: figure.left {and my own css} but I think it will help many people which are not so much into css or html to have their pages smaller on size.

Second thing is:
Responsiveness of images. When I align a image to the right and crop it to have a half/half with text and image it will stay on this size on tablet and mobile. I know, viewports are not supported to load different images but how can I manage it to have a smaller size on desktop and full size on tablet/mobile?

Beside of this questions - Is there an editor on your roadmap, where you can manage content setting up with blocks (not the blocksapp and not your pagebuilder)?

All the best,
Dennis


#2

additional problem:
When I change the margin style inside the figure tag and after this I set an link to the image it will set the margin to the default values. Is this a known behavior?


#3

Yes - I wonder if this helps you:

Do you have an example URL? Images should be fully responsive as set by the Template CSS.

Usually something like:

.img {
width: 100%;
height: auto;
}

You mean for example setting out a Page layout by determining what Blocks go on the page and where? If so, yes :slight_smile: If not, please let us know more information here and we'll see what we can do.

This is not known and could be a bug with the Editor. If you set it again after the link does it work? Can we have a little more information so we can replicate it?

Thanks


#4

An additional media query could also be helpful:

@media (min-width: 960px) {
  img {
    max-width: 480px;
  }
}

Now the image will be full width only on devices with a smaller width than 960px. Or to put it another way: The image will be resized to fit beside the text on desktop devices.


closed #5

This topic was automatically closed 14 days after the last reply. New replies are no longer allowed.