Another post about my blog, separate issue though. This one is driving me insane! So, when I create a blog post, I have it all formatting one way, but upon rendering, when viewing the blog post, it’s overlapping different groups from some reason. Example below:
This is the first time I’ve had an issue like this with Bubble. Today is an error filled day . Does anyone have any suggestions on how to keep this from happening? I have all the groups and everything as “make fixed width”.
Check for overlapping groups or groups or items that are invisible. Almost always is the case when that happens to me. Sometimes it was a hidden text element or something you don’t see right away. Keep looking. Something is there.
It’s so bizarre, I’ve looked and looked and there is nothing overlapping. I’ve even resized every single element in a way that would make sure no edges of groups and/or elements are touching at all. Still having the same issue. Checked every element, both visible and invisible too…
Look through your dropdown of elements you have on the page. Maybe check for duplicates or something hidden off page somewhere that you don’t know about. Sometimes it’s far away off the screen.
Something I tried too, was to take the links to the images and place them in between “[ img]” & “[ /img]” manually within the text editor. This still yielded the same results. Maybe it could have something to do with the fact that I’m pulling the images from multiple other sites because each company referenced in my blog post had their own stock images.
I’m also going to test hosting the images on one site and then pulling each of them from there to see if this changes the behavior…
Update: I even tried to expand the text element that displays the body of the blog post(from text editor) in an attempt to see if maybe it wasn’t big enough and causing a glitch. That didn’t help any.
I also attempted to completely delete the text element that displays the body of the blog post(from the text editor) and remake it. That also didn’t change the results any.
The only thing that will correct it, is if I refresh the screen and force my browser to re-render the blog post. Then it will sometimes make things adjust to their respect places. However, I can’t depend on my users knowing to refresh the screen when they see the page is all jumbled up.
I have also gone into the database to see how it is storing the image links and surrounding img tags. It’s all being stored correctly.
I FIGURED OUT WHAT THE BUG IS, BUT IT IS SOMETHING THAT BUBBLE HAS TO FIX ON THEIR END.
Ok so, if I take the text element which is storing the body of the blog and make it 20+ times longer, to accommodate the length of the blog with pictures included, it works only if “shrink the elements height if text get shorter” IS NOT checked.
Once this is done, it works flawlessly every time. However, once that box is checked, it starts to glitch again because for some reason it’s not properly expanding the text element to match the length of the post, hence why the content it overlapping and literally running off the bottom of the page.
By doing it this way, there is a HUGE amount of white space at the bottom of the body of the blog, between the blog body and the next group element. So, this isn’t a practical approach.
REQUEST: BUBBLE CAN YOU PLEASE FIX THIS BUG WHEN YOU GET A CHANCE?
I think you’ll have better results if you file a bug report. It certainly seems like a bug, so go ahead and file a report and see what support says. I’m glad you found the cause of the issue!
UPDATE: After receiving assistance from the helpful staff at Bubble, it was determined that my Bubble needed to be updated to the latest version. Once upgraded, the issue was fixed.
I was reluctant to upgrade Bubble out of fear that it would break my app. All is good though. Thanks again for everyone who assisted me the best they could…
. Does anyone have any suggestions on how to keep this from happening? I have all the groups and everything as “make fixed width”.
