Thanks a lot – worked like a charm!

Hey Jordan,

It’s http://www.onlineterapi.nu

I see now that my message got bolded here as well because I wrote < strong> but I think you got my point :)

Thanks, Rikard!

Hiding the widget worked perfectly. Just a dot missing behind page (if anyone is reading this and want to do the same).

Setting custom height was problematic though. If I used 248px it was perfect on 1920×1080 resolution, but not on anything between 1210px and 1900px. And there was no one value that would fit that span either so I would have to use many different custom heights to get it right. Isn’t there any other way to do it?

Hi Rikard,

I don’t think it’s because swedish characters. On this page: https://onlineterapi.nu/sokorsaker/angest/ I’m experience the same issue with the 5th and second to last entry in the side bar. Exactly the same position as on the root. Very weird.

Hi Jordan,

It was the lazy load. Thought I had tried without that already, but disabled it now and now timelime seems to be working as it should.

Thanks!

Ah, I see. Much to learn :)

Thanks a lot, Ismael. Everything is perfect now. Awesome support!

Just to clarify, I’m talking about the content on the entire site. Check these two images with and without the code included:

With code

https://ibb.co/Sn8146f

Without code

https://ibb.co/ys0Z0QQ

• This reply was modified 4 years, 11 months ago by illerrre.

Which is the css media query?

I posted the code under general styling.

You can login with the mentioned cridentials. Do, however, please provide me with info of the changes you are making as I’m writing everything down in an attempt to learn and keeping things structured.

I’m a bit confused now.

Regarding my other thread: https://kriesi.at/support/topic/responsive-sidebar-widget-how-can-i-get-this/

The code you recently gave me in this thread is what is keeping the desktop design (overall one with main content and sidebar) appealing. More specifically this code:

@media only screen and (max-width:800px) {
.responsive .avia_responsive_table .avia-data-table .avia-button-row, .responsive .avia_responsive_table .avia-data-table tr:first-child th {
display: none;
}

I changed it to apply on resolutions over 800px and now what I wrote in the other thread is fixed so that is absolute fantastic.

However, I noticed that the code affected several of my font styles. I’m not sure why, but is there any way we can resolve this? I have for instance chosen font style for H1 under advanced styling. Also, styling on https://onlineterapi.nu/boka-tid/ was changed. “Emelie Bergström, Telefon, Skype, Email” was previously black and is now blue.

Hi,

I thought I had already played around with that enough to be sure that nothing would work, but I actually got it to work now. Thanks a lot!

Just one thing. On 1700px – 1920px with the content is really nicely centered on the page. Resolutions below 800px are also pretty nice.

However, between 800px and 1700px and especially 1200px – 1700px main content is too much to the left for my taste. I can live with it, but if there’s a fix to get this more centered I would really appreciate it.

Hi Ismael!

Thanks a lot for the code. Works pretty good – just one problem. The top row goes above all other rows, which it doesn’t on mobile view. Switch between 1200px and 400px and you’ll see what I mean. Is it possible to have the code you posted adjusted so that the view is identical to the 400px one?

Hi Victoria,

Perhaps, but I don’t want that as that would make the design less appealing. I believe it’s better if the table can go mobile view on higher resolutions than the current limit which is 768px.

Hi,

If 100% means the same as the mobile view then yes.. I don’t know how that is going to look, but at the same time I don’t know if I have any other alternative. With four columns and a sidebar I can’t make the table look good on resolutions between 700px and 1600px.