Streaming live at 10am (PST)

Offset columns issue when published on my hosting

https://preview.webflow.com/preview/explore-romania?utm_medium=preview_link&utm_source=designer&utm_content=explore-romania&preview=bcac7b3a90bfc93adfd53c8cb1bdf2b3&pageId=5cbeebb933a3f461442b317f&mode=preview

Hi,

I have a problem with two columns that are offset by around 1.5 lines when published on my hosting. On the webflow.io subdomain it looks fine though, but what matters, in the end, is what I see on my hosting.

Same files:
NOT OK> http://mariusgrigore.com/test/explore/v2.9/hiking.html
OK> https://explore-romania.webflow.io/hiking

Will appreciate any insight. Thank you!

Marius


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Weird bug and I can’t seem to see why it happens. However, you’re using a H3 element for what should be a paragraph. Can you try deleting it and style a paragraph element from scratch in its place?

Chances are it will fix your issue.

Edit: also try tu put the 2 columns property on the paragraph element instead of its parent.

Thanks Vincent!

I will try your suggestions. What is strange though is that until version 2.7 it was all ok (http://mariusgrigore.com/test/explore/v2.7/hiking.html).

M

PS: I am not following the “CSS grammar”, as you pointed out about the H’s and paragraphs; and you pressed a pain point for me, so please allow me to share this with you:

I lost my enthusiasm about Webflow being a tool for designers with no coding knowledge. I discovered through trial and lots of error that it’s rather a tool for coders and programmers to build fancier stuff. You need lots of knowledge to make Webflow work smooth, and unfortunately I lost my hope to find all this knowledge in one place, like it would make sense. There are a huge number of basic issues that aren’t solved yet, while much more advanced stuff are tackled. Which is fine, it’s just that it signals a paradigm of building a product for advanced coders, and not for the “designer without coding knowledge” (which is Webflow’s brand promise). So having said all these, I don’t know why I should use H’s instead of anything else, since there are much more basic and worse errors I have to deal with every single time I want to build something. Since I don’t have the overall map, I don’t know why it’s better to take the H’s road instead of Paragraph’s road.

Sorry for this long paragraph, but I hope this makes sense for you.

I would be happy to receive guidance or to read some necessary books or literature to “put the house in order” before jumping into Webflow, but all their marketing is stating that it’s no more difficult than their easy and funny demo videos.

I would really appreciate any suggestion or references.

Thanks again!

I think a lot of poeple are using Webflow without knowing much of CSS and HTML. It is true though that knowing CSS and HTML allows you to use the full potential of Webflow. Webflow has an almost strictly CSS style panel, which means it’s a UI for HTML and CSS. Using Webflow means getting better at web concepts such as CSS, box model, DOM etc.

CSS and HTML are very easy to learn. It’s just… learning. By learning them, you get better at wfWebflowand by using wWebflow you get better at them.

A VAST world of elearning is waiting for you. CSS classes at codeschool, or Udemy, for example. What you should learn is:

  • HTML5, the DOM
  • CSS, box model…
  • How to use Chrome inspector (once you know your basics in HTML and CSS)

↑ this is very achievable

What is absolutely sure is that for now there’s no equivalence for wWebflow you won’t find something that’s as easy and ambitious. Also see it this way: any time you’re going to invest at beingbetter at wWebflowis time you’re spending being better at web concepts. You’re not going to lose a minute of your time by investing it into Webflow.

Hi Vincent,

I’m happy that you offered this answer! I think this kind of message should be right at the beginning of every Webflow course or be transformed into a course in itself. And I sense that these things are the most foundational aspects even before jumping into Webflow. I totally agree Webflow has no competition yet and I never regret learning it — it’s just that many times I’ve felt like a grumpy caveman assembling an Ikea product that clearly is missing some parts. These parts are probably the ones you’ve described, and I won’t spend any more time with Webflow before learning about your recommendations. I stopped keeping up with the latest amazing features because I lack these basics.

Thank you so much for the advice!

Marius

I put the 2 columns property on the paragraph, not on its parent and it worked.
Thank you!
M

I promise that this sentiment will fade away and then morph into an empowering feeling. With practice, and more importantly the will to progress, you’ll be better and better in a short time. You have to embrace the fact that development, wether it’s code or no-code development, is a practice for curious people who will search and look for answers, good practice, all the time, at any stage of their knowledge. That’s what designers and coders do, that’s what I do to answer people on this forum: I search for their answers. My understanding of the platform makes me efficient at that but nevertheless, I search, I test, I compare, I look for answers, I ask questions to the more savvy. I’ve known a lot of developers and I have yet to find the one who writes lines and lines of code without checking a documentation of some sort. Searching, testing, applying, that’s what development is made of. You get to the point where you’re more efficient, but you can never stop to learn.

So Webflow doesn’t lie when it says no-code, visual development. Anyone can take a template, fill it up, and start enhancing it with the right help. It’s a great way to start.

Web development is like no other development or design practice. Graphic design has a definitive output form, filmmaking ends up with a movie, apps can be sandboxed and run he same on many platforms (think of a Java or a Flash app), but web… web is interpreted on each platform. New set of OS/Browser every time, and I’m not even talking about bandwidth and client device strength or screen size. The sum of things to know and master is tremendous, and that’s where webflow comes to the rescue, by dealing with a lot of hassles for us — for instance I just finished a complex page with combinations of Lottie, IX, HTML etc, and it just works the same on very browser I can run on my devices. That’s a HUGE thing. In my previous life I was facing long hours of debugging and potentially rework my designs to make them less ambitious for the sake of compatibility.

Web design is very complex, and that alone explains the success of Webflow.

Your message is very inspiring. I will print it and keep it on the wall next to my desk.
I’ll be starting a two-month UX course in two weeks, and in parallel I will try to learn what you suggested. I hope that by the end of December I’ll have the mindset you’re describing.

Thank you.

M