-
Posts
-
Hi
the separator seems not to work properly.
Its definiteley not there where i putted it.
Please see video:
[video src="https://maskenzauber.com/temp/separator-issue.mp4" /]Live (in fact the separator is after the first paragraph and not almost on the end of the post):
Please let me know how to fix that
marenHey Maskenzauber,
We need the WordPress backend access to further investigate this issue. Please post it in private content area.
Best regards,
VinayHere is a FRESH PAGE and again a video.
[video src="https://maskenzauber.com/temp/separator-bug.mp4" /]The bug is totally obvious!
here is the URL for further investigation:
And here is the CODE of the page and you can reproduce it in ANY installation (we tried it.)
[av_textblock size='' font_color='' color='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='av-jlus4uzn' custom_class='' admin_preview_bg=''] <img class="alignleft size-portfolio wp-image-21078" src="https://maskenzauber.com/wp-content/uploads/Profil-Maskenkuenstlerin-495x400.jpg" alt="" width="495" height="400" />Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. [av_hr class='custom' height='50' shadow='no-shadow' position='center' custom_border='av-border-thin' custom_width='50px' custom_border_color='' custom_margin_top='30px' custom_margin_bottom='30px' icon_select='yes' custom_icon_color='' icon='ue808' font='entypo-fontello' av_uid='av-rw65hm' custom_class='' admin_preview_bg=''] At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. [/av_textblock]Hi,
I think this issue is caused by the floating text around the image. Please try to add this code to the quick css field or child theme style.css file:
#top.page-id-3447 .hr-custom.hr-center { float: none; padding-top: 30px; }Best regards,
PeterNachdem ich dein Video gesehen habe ist klar: du willst das unbedingt so haben, weil du das Bild vom Text umflossen haben möchtest.
Denn die 100% Weite ist die des gesamten text-blocks und nicht des Textes neben dem Bild.Das funktioniert wenn man dem Bild auch relative Weite zuordnet:
Siehe hier: https://webers-testseite.de/maskenzauber/Wenn du interessiert bist poste ich wie es geht.
____________
After I have seen your video it is clear: you absolutely want it to be like this, because you want the text to flow around the image.
Because the 100% width is that of the entire text block and not the width of the text itself.This works if you also assign relative width to the image:
See here <a: https://webers-testseite.de/maskenzauber/If you’re interested, I’ll post how it goes.
Translated with http://www.DeepL.com/Translator
gib dem Text-Block Element ein benutzerdefinierte Klasse – ich nahm : hr-inlinetext
.hr-inlinetext img { width: calc(50% - 20px); } .hr-inlinetext .hr { display: inline-block; width: calc(50% - 20px); float: none; } @media only screen and (max-width: 990px){ .hr-inlinetext img , .hr-inlinetext .hr { width: 100% } }die 20px kommen von der Definition der Custom hr :
.hr-custom.hr-icon-yes .hr-inner {
margin-left: 10px;
margin-right: 10px;
}das sind jeweils 4 lücken a 10px – die müssen in die Werte mit einfließen – sonst kannst du also mit den Prozentwerten die 100% haben – also 40/60 etc.
mit dem MediaQuery musst du schauen, ob das dein “Sprungpunkt” ist bei dem das Layout wechselt. Bei meiner Testinstallation war es 990px@dude
“I think this issue is caused by the floating text around the image.”
Of course it is. It was obvious right from the start and i am really wondering that it takes days until supporters realize what the request is about.So there is NO WAY to get a separator into a floating textblock without writing CSS rules for every URL your trying to style??
If so…this is painful and a real gap in the possibilities of a modern theme.
I am not addicted to have an icon or something, but a way to loosen up a textblock is the least i would expect as an option.
@Guenni007 & @dude
There are reasons why i decided to use a floating textelement instead elements from ALB
1: There is no option to add a portrait format via the ALB-element “image” – only different landscape & square
2: The responsive behavior of the text when using ALB is not the best you can think of.
Just scale down to a common tablet-size and watch the ugly white spaces in the upper part (created with ALB-columns)
Just compare:Maren
Hi,
So there is NO WAY to get a separator into a floating textblock without writing CSS rules for every URL your trying to style??
You could use the custom css class settings: https://kriesi.at/documentation/enfold/intro-to-advanced-layout-builder/#turn-on-custom-css-class-field-for-all-alb-elements to apply these rules to all separators with your custom css class. You could then embed these separators into your floating content and you don’t need to write extra styling rules for each url.
Best regards,
Dudedid you read my posting carefully?
Give to the text-block to which this issue concerns a custom-class! in my case i set it to: hr-inlinetextthen the rules will work for all text-block elements from enfold with img inside and text floating around and that specific class:
see what happens( da die Klasse fehlt musste ich jetzt ohne den Code einfügen): Movie
– wenn du das Bild auf der eingestellten Größe läßt, dann bekommst du bei Screens knapp über den 768px ein extrem schmale Textleiste neben dem Bild.@Guenni
ich habe extra ein Theme gekauft von dem ich dachte das ich mir dadurch ein CSS “Studium” ersparen kann.
Enfold scheint so langsam in Richting Avada abzudriften.
Haufenweise Features aber an den Basics hängst gewaltig.Zu deiner Frage: ja – ich habe es gelesen.
ich habe sogar versucht es zu verstehen.
Aber wie gesagt – wenigstens was die wichtigesten layout-Features angeht erwarte ich Optionen – und nicht das ich Stunden mit “workarounds” / “fixes” oder CSS-Studium zubringen muss.
Ich versuch Deine Tipps umzusetzen – aber sonderlich glücklich bin ich nicht darüber, das es hierfür keine Option gibt (wie für vieles andere was meiner Meinung nach eher überflüssig ist)
@dude
of course i acivated developer-elements (you could know since you have acess)
But that still means that i have to set classes and give them any kind of rules.
Please remember what i am: a customer, not a developer.
And you as developers should give options so that nondevs can get at least basic layout structures.
- You must be logged in to reply to this topic.