Hi there

Nothing seems to have have changed?
there is a still a white gap between the top grid and the next grid – that shouldn’t be there – I wanted all the images to be touching.

Viewing on a mobile the text and buttons still align to the top of the images when they should be centred.

And there is no hoover effect?

Im not sure what that code you added was meant to do?

I am on a tight deadline now to get this website live for my client and only have a few days left to get this sorted please help :-)

Cheers
Natasha

I’ve been able to increase the memory limit and my website is now loading better on a mobile device. We still have the problem of a transparent background when the visitor clicks on the menu. The tabs become unreadable. On the desktop version of the site, the background color is white in the menu bar. We don’t understand why it changes to transparent on the mobile view. We’ve looked at the settings for Mobile view in the Enfold theme settings and they are set to white.

singlecarrot.com

Any help is much appreciated. Thanks!
Erin

Hi Rikard, thanks for your reply. Please check the private section for the login details. I have managed to replicate some of the style via css. but please feel free to delete the css if it can be done with settings.

The css i added:

#top .fullsize .template-blog .post .entry-content-wrapper > * {
  margin-left: auto;
  max-width:100%;
}
#top .fullsize .template-blog .post .entry-content-wrapper {
    text-align:left;
    font-size: 1.15em;
    line-height: 1.7em;
    max-width: 100%;
    margin: none;
    overflow: visible;
}

#top .fullsize .template-blog .post .entry-content-wrapper > * {
    max-width: 100%;
    text-align: left;
}

.fullsize .template-blog .post-title {text-align:left !important;}

.fullsize .template-blog .post-title {
    text-align: left !important;
    font-size: 30px;
    padding: 15px 0;
    max-width: 100%!important;
    margin:none !important;
}

.fullsize .template-blog .post-meta-infos {
    text-align:left !important;
}

#top .fullsize .template-blog .blog-meta {
    float: right;
    margin: 0 auto;
    display: block;
    position: relative;
    width: 81px;
    overflow: hidden;
    text-align: center;
    z-index: 1000;
}

Hi Andy
I am wondering if the order of the arrow buttons can match the order set by the previous page in the portfolio grid. They are are to ascending by page title in the portfolio grid, while the arrows on the detail feel like they are set to publish date.

Scroll to bottom of this https://kriesi.at/support/topic/how-to-customize-previous-and-next-button-in-post/

is this a similar solution?

I tried that, but the video still doesn’t load on mobile. I have a way to do it with some Javascript, but I need a way to manually edit the <video> tag that gets output to the browser. Where can I go to edit that? Basically I just need to add a few attributes to it like this:
<video autoplay muted loop webkit-playsinline src=”filename.mp4″></video>

I’ve been going through the files with the theme and haven’t found a way to edit that. Ideally, I really only want to edit it for mobile. It shows perfectly on desktop.

I’d appreciate any help you can provide. My client really needs this video to autoplay in the background on mobile.

Thanks,
Todd

Maybe its an iOS issue? Are you using an Android or Apple device?

I have no problems ripping into Apple if we can determine its their issue. I get the same issue when I “request desktop site” on both Chrome and Safari. Could it be the way the iOS translates something?

See private notes

Yeah, but that was during debugging, meaning the padding was set to 0.

Again, I need padding 0px on welcome page and padding 80px ALL other pages.

Right now I use this in this order:

.html_header_top.html_header_sticky #top #wrap_all #main {
padding-top: 80px !important;
}

.html_header_top.html_header_sticky .page-id-43 {
padding-top: 0px !important;
}

Result: The Welcome page also has padding 80px.

Hello, Ismael,

I got it you can ignore my last letter but now I would like to do the same thing with my homepage accordion slider.

I would like to display different font sizes in Desktop and Mobile is it possible and could you give me the code, where I could adjust the size for Desktop and Mobile?

Regards,

Aah! I think I may have fixed it! Writing the post made me remember a code that @joesue gave me for another site to do with mobiles. This seemed to have solved the issue. Could you guys tell me if it’s “safe”?!

@media only screen and (min-width: 768px) {.html_header_top.html_header_sticky #top #wrap_all #main {
padding-top: 224px !important;
}}