I have problem with fixed, sticky sidebar on smaller screens (14" or 15"). On regular screen I have no problems, as you can see on following image:
Sticky_Sidebar_Desktop
But when I visit same link from device with smaller screen size (14" or 15") I have top sidebar/widget cut-off to half, as on following image (ad area):
Sticky_Sidebar_Cut_Off
Anyone had experience with this? I even tried with JavaScript and CSS, without success, can't produce any reaction or function to help me with this issue. Any advice is more than welcome! Thanx
Tried with combination of JS and CSS I used many times - nothing, tried even with some plugins - no success.
Related
Not sure why that happend - even having my breakpoints on 1024/1025 (tablet/desktop) - listing grid SLIDER(because only slider catches bug) breakpoint is 1014/1015 (tablet/desktop). First time this is happening to me and I'm confused - anyone had that problem before and knows what might be causing this problem?
I found the problem and maybe for someone in future it will be usefull.
Problem was horizontal gap bettwen each slide on tablet - it takes default value from desktop (if I don't change it) and it was for some reason too big in my case. I had 40px gap bettwen slides on desktop. I changed it on tablet to 20px since it took desktop value by default(40px). Reducing that gap on tablet fixed my problem with breakpoint screenshoot
I am having an issue with a website for our student-organized congress at http://ebspreneurship.de that randomly bugs roughly 1 ever 5 times - sometimes more, sometimes less.
I have three revolution sliders - one is the above-the-fold content (full screen), just under it is the Elements section with another full width revolution slider(RS) and then on the bottom I have this map.
From time to time randomly one of the 2 upper sliders (the last one never bugs) disappears and shows only the background image. I can't trace what's the problem, i spend a few days on that. I notice that if I start many browsers with the website and find one that's bugged, there is an error on Inspect:
Issue at YouTube Video Pause:
(unknown) TypeError: d.getPlayerState is not a function
Still, tried without youtube video and it bugs the same way with only BG image, so that error is for now irrelevant.
I just don't get what's the problem and I tried disabling all plugins, i tried playing with caching methods or disabling it... Nothing changes it...
Any help would be greatly appreciated!
OK, for some reason on random intervals the page loads with my main layer div being with "visibility: hidden;", while the div of the image has "opacity: 0.0001."
So,i went for brute force solution of overriding all div's ids one by one on both sliders.
It worked, since, as seen in the image, the browser loaded with hidden divs and opacity 0.0001, but my override worked and still displayed correctly. Image of how the bug was overridden and displayed correctly
Thank you for the ones that tried to help (I noticed quite a few good souls that as always are found around here)!!
I'm building some responsive WP themes with the idea/hope to make it super-easy for an end-user to setup a simple site that looks good. This is my first attempt at learning responsive as well and can't quite get a complicated logo / company name / tagline feature worked out. Proportional, centered, unknown widths, oh my!
You can see a mockup of some of the different situations we'd like to handle at http://screencast.com/t/G8O1G4aY. The left shows a rectangle logo, a square logo, then a square logo with some text and a square logo with more text.
The right side shows how we'd like the responsiveness to look, as the screen gets smaller. The image starts reducing from a max-height of 200px-ish to 100px-ish and the font-size starts reducing as well.
Hoping to not have to rely on breakpoints to set the sizes. We've already accepted that were going to have a 'you have JS turned off, its ugly this way' message, so something like http://simplefocus.com/flowtype/ to adjust the font-sizes would be quite alright.
Can it be done?? Can get into more javascript to solve if needed, but hoping for as much CSS handling as possible.
Thanks much for any help! Keep getting this piece or that - but can't get them all together.
Philip
I have been trying to code a responsive thumbnail group that I'd like it to respect to a few rules.
I came very close but the implementation always end up not satisfying at least one of the rules. In other words when I try to do one thing it always cancels the other.
In summary, what I am trying to achieve is something like this -
http://postimg.org/image/4yx6poscz/f57d6517/ (I wasn't allowed to post a picture, sorry)
So basically, what I am after is;
When the user resizes the window the thumbnails (consist of an image and some basic HTML) will shrink up to a point.
When the breakpoint is reached, the most left one will disappear and the rest of the thumbnails will return to their original size.
Continue until the min-body size where we just display the x-axis scrollbar.
So, referring to the image, providing that no resizing is done just yet, the items will shrink, lets say until 20% and then Item 7 will disappear letting free space to the rest of the row to expand to their original size.
I am currently using the latest version of bootstrap however, as you may guess col-lg col-md and etc. classes are not really helpful in this case. I have come up with some custom breakpoints but I can't get my head around the shrinking back to the original size issue. That is where I get stuck.
Also I think it's worth mentioning that Ive been trying to come up with a solution that is pure HTML and CSS however I am definitely open to JS solutions as well.
A good example would be spotify's webplayer (play.spotify.com) thumbnail examples.
Thank you very much in advance for your suggestions.
I'm working with the Header Image Slider plugin for WordPress (which uses the Nivo Slider) and I can't seem to get the images to the size I need on a smaller screen.
I've looked around plenty and tried various things in my media queries like setting the max-width, but I can't put my finger on what the problem is. Each image is cutting off on the right-hand side. I'd like to get the images to roughly 708x245 on the next step-down. Any advice? Thanks!
My Site