closed not a support question
liquidpixles
Member
Hi everyone, I am having alot of responsive issues. I am getting menu overlapping, images I have put in are not responding, and slideshow is cutting of.
I love this theme and Im sure its only a little thing but Im not good enough to track down the issues
Any help is much appreciated..
liquidpixles
Member
I am checking it on a Widescreen mac and just resizing and seeing errors in the menu. The menu overlaps the logo. and slider cut off
My client is seeing errors on iPhone, same deal and the slider is being cut off. I cant really play around with the CSS as Im not that good to be honest. But should it be tested first or could I have caused this with my images I put in?
Ismael
Moderator
Hello,
I'm sorry for the inconvenience. It is rest assured that the theme is responsive. Thousand of users can attest to that. Kriesi is not going to be the top author of themeforest if he can't back up his claims. Please do understand that there a lot of inquiries up and we are trying to answer each of them. We are very sorry if we didn't answer your inquiry as fast as you expected.
Maybe you can try this on your custom.css to fix the slideshow.
/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {
.responsive #top .caption_supersize .slideshow_caption .featured_caption {
font-size: .5em;
}
.responsive #top .caption_supersize .slideshow_caption h1 {
font-size: .8em;
}
}For the logo, please to try adjust the image size that you uploaded and see if it works.
Regards,
Ismael
liquidpixles
Member
Yes mate, I know the theme is responsive, I really love it, just it needs to be made clear that any editing of images or adding images needs to be done through an admin system, as most people dont have the skill to code responsive. Well I dont anyway.
Thank you I will give it a try How has this happened? Have I added too much content into the slides??
Nick
Moderator
Hi,
I am sorry about the delays. My fault entirely. I apologize. The code that Ismael gave you needs to be pasted in the admin area of the theme, in Coherence Theme Options > Styling and on the bottom there's the Quick CSS textbox. Please hit the save button and that's it.
I wouldn't put much weight into the WC3, or their buggy theme checking gimmick. Until HTML5 is finalized in the next few years, every browser has their own standards, so nobody knows exactly what it is that WC3 checks. Ebay, Amazon and Yahoo - each fails validation with over 300-500 errors according to WC3.
However looking at the PR of websites using Kriesi themes, it becomes self evident that Google approves and rewards the sites using those themes - which adds up to better traffic and more sales.
I am sorry, I don't have a wide screen Mac (though sure would love to get one) to test the site.
Great care must be taken when customizing a sophisticated responsive design since unlike regular themes, responsive themes are perfectly balanced to simultaneously work on home computers as well as mobile devices of various screen sizes, resolutions, capabilities and operating systems made by competing companies unwilling to conform to any standards.
Yet the payoff for that extra time spent dealing with a responsive design are huge, since 40% of online traffic today comes from mobile devices. No worries, the support team will do our best to ensure that you aren't abandoned, or I wouldn't be writing this at 7am on a nice Sunday morning. :)
Thanks,
Nick
Nick
Moderator
Hi,
I fixed a few things on the page /certificate-3-in-hospitality/. Please paste the code in the Quick CSS in the backend. You should read an article on responsive design since you are treating it the same way as regular design.
In essence there are 3-4 websites in here, each one triggered when the screen size becomes greater than a certain number of pixels.
First you take the smallest screen size Android/IPhone portrait, and you go to all the pages and make them look the way you want on that size, and then you take the next size up, mobile landscape, then tablet, then desktop computer last.
Please try to use as much of the theme as you can since each time you introduce new images you have to figure out what to do with them in all 4 responsive layouts. I suggest you install Firebug browser widget for Chrome (easier) or Firefox and try playing with CSS.
It’s easy with Firebug, and will go a long way in making you better understand how to tweak things.
/*
This first group below changes the title bar on top of /certificate-3-in-hospitality/ page
This size is for tablets (see first line)
*/
@media only screen and (min-width: 768px) and (max-width: 989px) {
.stretch_full.title_container {
background-image: url(../wp-content/uploads/2012/07/titleBGcirc.jpg);
background-position: 100% 40%;
background-repeat: no-repeat;
display: block;
-moz-background-size: contain;
-webkit-background-size: contain;
background-size: contain;
}
}
/*
The first group lowers the font size and centers the title at iphone landscape size. on /certificate-3-in-hospitality/ page
The second group is the same title bar at lower screen size. i blew it up a bit yet want to make text readable.
*/
@media only screen and (max-width: 767px) {
.title_container h1 {
margin: 0;
font-size: 21px;
text-align: center;
position: relative;
z-index: 2;
}
.stretch_full.title_container {
background-image: url(../wp-content/uploads/2012/07/titleBGcirc.jpg);
background-position: 10% 40%;
background-repeat: no-repeat;
}
}Good Luck,
Nick
This topic has been closed to new replies.
Please start by registering an account for this forum here
Create a new thread and tell me what problems you are encountering and what you want to know.
There is no step 3 :)
We try to answer all questions within a day, monday-friday.
