I have a website http://www.vinjerac.com which has an image slider.
The complete site is responsive, but the slider content does not fit the viewport in mobile devices and the website looks distorted.
Can you please suggest a solution for the same.
Thanks
I did have a look at your site, and found you are using bootstrap for the responsiveness. And also a plugin for the slider.
Bootstrap is not designed to work with other plugins.
One workaround would be use a bootstrap slider which is also called carosel instead of the plugin that you are using you find the bootstrap carosel here
Please let me know if you need any other information.
Related
Hi I've got problem with responsive design because it's working in browser, when im changing browser size to small site is changing but when i'm going on site using mobile device or inspect element tool it's not changing. Here is demo of website: https://horrorfiles.htw.pl
I'm using tailwind css and react js, i made lots of projects using that and thats my first case.
I guess you need to read proper documentation and then apply the usual breakpoints for responsiveness here is the documentation of breakpoints and everything looks on good on your site.
enter link description here
I think the problem is you're using the breakpoint prefixes to target mobile devices instead of designing for mobile then using breakpoint to target larger screens. Tailwind's documentation has this: https://tailwindcss.com/docs/responsive-design.
I am trying to make a webpage with HTML,css and jquery. But the problem is that the webpage is not working properly on phone or other small screen devices. Here is the link for the page.
The solution is quite simple. To have responsive layouts, use percentages for width/height and margins rather than pixels (px) so that they can auto-resize when the screen size changes. To make your bottom bike image look responsive, use width: 95% and height: 95% (or whatever other percentage you'd like). For the Bikerz icon, try using margin: Google Chrome's inspect feature is very useful so make sure to test it out on it. Simply right click on the web page and click Inspect. Once you are there you will see an icon left of the "Elements" section. When you click that, you can view your web page layout under different resolutions.
Either you have to write custom css to support mobile device or I will recommend to use Bootstrap framework in order make compatible your site on mobile. Bootstrap will allow you to developing responsive, mobile first projects on the web.
If you are going to use css then, i will also recommend you to validate your css support at different browser and mobile platform through canIuse.
I am building a website based on wordpress theme which should be responsive. But if I resize the browser window and make it smaller, the menu just hides somewhere under the header. Is there anyone capable of fixing that?
The Website
you can use bootstrap framework for responsive theme
work with bootstrap is easy
bootstrap
We are creating a site which is responsive. However, due to time constraint, we need to make a few pages only work for the desktop viewport. The pages have a top navigation which is responsive. Is it possible that when accessing that page from a mobile, the navigation is responsive, but the rest of the page just loads completely adaptive (like a non-responsive site would load on the phone)?
Please advise.
I dont think, that this would work very well.
How would you put two 1000px and a 300px width element on one page so that they both use 100% of the screen?
Maybe you can make a responsive page with navigation an all and load the pages you dont get responsive in an full size iframe below the navigation. But dont know if this would work very well. Also iframe handling, like scrolling etc is a bit picky on mobile devies.
I have a website for my business coded entirely in HTML. No CSS at all. The problem is that every page except my index.html home page is scaling the text (on android) and reflowing it so that it is a readable size on the page.
So my question is: how would I go about making my website display properly on mobile devices using only HTML?
Have you evaluated if using a viewport meta tag would suffice for your needs ?
https://developer.apple.com/library/safari/documentation/appleapplications/reference/SafariHTMLRef/Articles/MetaTags.html
I believe chrome supports the viewport tag as well.
It's not possible to build a responsive website using only HTML. You need things like CSS and jQuery to make it responsive.
If you post your code, I will give you a few examples on incorporating more of a responsive design.