I just created this page for a product and if you compare it to original page in Xiaomi website, well you can say I did very similar on desktop and it looks fine but when I open it on mobile, you can see yourself how bad it is, have same issue with my other pages, can anyone help me where are the problems and possible workaround or I should just make a simple webpage without all the fantasy look I liked to create? thanks
https://flashsystem.ir/product/xiaomi-redmi-10a-64gb-3gb-ram/
I tried messing with css box but it doesn't make things look good on mobile.
Related
I am a writer and I have menu for my chapters list on my website of 30+ chapters and currently it annoyingly looks like this:
current website
As you can see it cuts off, and Wordpress annoyingly doesn't have a feature that turns it automatically scrollable. There are 30+ chapters and you have to keep scrolling, scrolling, scrolling down to see them all.
I have found some good looking solutions on StackOverflow but don't know where and how to apply them on Wordpress.
If anyone could talk me through literally step-by-step 1. where to find the CSS of my Wordpress site 2. the code I'll need 3. where to paste it 4. if there's anything I need to add to the navigation block's inidividual "Additional CSS Classes" part like so: Additional box in the corner and anything else I need to do. I would be super grateful!
One of my fears is just dumping a bit of code somewhere in the middle of editable CSS and screwing up my entire site! My CSS knowledge is super beginner so laymans terms is very much appreciated thanks :)
I tried using Plugins (those seem even more confusing than CSS) and have considered using Elementor too but I have Googled and YouTubed, trying to find a solution and nowhere has something as specific as what I'm looking to achieve frustratingly.
I tried following this youtube video: https://www.youtube.com/watch?v=73XjO7hFZaw but didn't know what my "Target Element Selector" was, even when I went into Inspect on Chrome, all I found was this
I am working on a wordpress/woocommerce website (using the Flatsome theme if it's important) and I am having some CSS issues with the mobile menu overlay. When I preview my mobile site using chrome dev tools everything looks as expected (centered options, large enough to be easy to use, etc) but when viewing the site on actual devices the menu is being forced edge-to-edge in a small, cramped, italicized font. I cannot seem to figure out where it's being overridden, or why it looks different from dev tools to actual use.
This is what it SHOULD look like according to dev tools:
MENU-CHROME-EMULATION
But this is what is ACTUALLY looks like:
MENU-ACTUAL-ANDROID
My website is: TARGET-WEBSITE-CITRUSBOOKBINDERY
FOUND IT! It was actually a conflict with the SG Optimizer plugin rather than a CSS issue, which is why I couldn't find it for so long. I thought I had checked all my plugins, but must have missed that one out. I'll leave the question up in case it can help someone else, though.
I'm having an issue with my website http://www.ben-drury.co.uk/ (I know the content sounds dumb, but it's my first attempt at a portfolio and it's not finished) where the formatting of the text is very peculiar under a specific set of circumstances.
When loading any post or page in Google Chrome, if I remain in the tab for the duration of the loading it looks like the image below, which is perfect and exactly what I want.
However if I start loading the webpage in a new tab and don't instantly navigate to that new tab, or indeed if I refresh the page and navigate away from the tab, when I come back it looks like the image below.
Interestingly it seems to work absolutely fine in Internet Explorer and Firefox, so initially I thought that it might be an issue with my installation of Google Chrome. However testing it on other computers resulted in the same thing happening, and a variety of different ways of phrasing the issue has turned up very little.
So essentially, how do I fix it for Google Chrome users?
(For those that cannot see the images, the text in the post placed as an example runs outside of the box it should be displayed in and often lines appear over the top of each other around hyper links.)
Update:
I've managed to fix the issue for pages by removing the justified alignment of the text. However I have made said change to the posts as well yet the problem persists for them.
So after a little more delving into the issue, I came to the conclusion that not only was the idea of web safe fonts actually a load of miss-represented nonsense, but that Google fonts might be the way to go. After installing a plugin for Google fonts onto WordPress and making all my posts use one by default, my problem has been entirely resolved and I can even have justified text on my posts and pages.
I have a big old site that I have been growing over the years,
www.vintagewatchstraps.com. Almost all pages validate as HTML5.
Now Google has started grumbling that it isn't mobile friendly. I can add the "meta name=viewport" business, and I understand that I will need to change things like widths to be in % rather than pixels, but the thing that is bothering me most is the navigation.
I have been reading up about making a mobile friendly CSS navigation bar, at Medialoot and Lisa Catalano, but the examples they give have only a few pages. If I displayed my navigation as a vertical list on a small screen as they suggest, my 70+ navigation links would go on forever. All the examples of adapting a site to mobile that I have found just don't cover sites having lots of content and pages.
Any suggestions as to how to deal with this would be gratefully received.
Kind regards - David
Some ideas:
do you actually need all those links in the menu? Try only including the main things people want to see, as people aren't likely to read your entire website on a mobile device anyway.
have two layers of menus: a heading reveals another slide out menu with subcategories
put a search box at the top of your menu
I am experiencing the following (strange) bug:
When my site is seen on iPhone 4 (haven't tested on 5), an extra "Search web" bar appears when scrolling up and down. It slows down the browsing dramatically. It happens on both Safari and Chrome. It doesn't happen on other sites on the same device (so it is not a problem with the phone itself or its browse).
I cannot find any similar reports on the internet.
Has anybody seen something like this?
Could you have a look at my site www.justrunlah.com and check if something is wrong?
Can you even reproduce it?
Screenshot:
thanks a lot in advance
Try hiding the search bar within your website (header-search) and see if the problem still exists (just to test to see if its your own searchbar that's causing the problem).
It was some sneaky code added by a plug-in.
More specifically: Sweet Captcha used a code connected to Errnio to monetize
I removed the plug in and it's gone
Read more: https://wordpress.org/support/topic/hidden-search-bar-features?replies=3