Mobile frontend has a bug: container is not fixed - css

I suck at mobile frontend / responsiveness. Could someone tell me why the overall container of my webapp is not fixed but slides around when you move it?
I hope you get my question but you can basically move the whole page front left to right.
here ist the page: www.frankfurtstartupjobs.com
I am sure it is something simple, as of again I suck at mobile / css.
Thanks a lot in advance!

If you are talking about page is moving around when we drag it then here is solution
look for class container_header in your html page and add container class to it
this will fix your issue

Related

Flow into view (don't know the technical term)

I don't know what this is called, but I've seen it on a few websites where when a div scrolls into view it flows to the top hiding the previous block (well scrolling out of view). It like a slideshow but vertically and shows the content. It's kinda like a normal scrolling web page but brings segments into view.
Does this make sense??
Does anyone know what this is called so I can Google how to do it in css or jQuery.
Thanks in advance
If I understand correctly your question you are searching for sticky position. You can see how to do it here: https://css-tricks.com/position-sticky-2/

responsive not full width when loading single page

I am trying to make a responsive website, but I am stumbling upon a weird problem. When I am looking on the desktop page, everything is in the right position. There are no pixels left.
However, when I am loading the responsive version on my mobile, I see some pixels left (just scroll to the left or the right and you will see what I mean). The problem gets bigger when there is content like a single post or page.
The website is here: http://FavoriteFM.com.
I can provider the CSS code, but it will be a lot of lines. I am suspecting something in the content is 'sticking out'. But I am not sure of a tool that can see such problems.
Thanks,
Dennis
Today I have disabled every div by div. I figured out the problem is with the sidebar. I still had: 'left: 8px;' on. Removing it did the trick for me. So if you have this problem, check if something of your content is 'sticking' outside your wrapper. Even if you can't see it, it still can be there.

making a responsive long and thin carousel

Hello and thanks in advance for reading, actually am having a strong issue with a long and thin carousel that is making me nuts :/. The thing is at this site http://gabouh.com/sitio/ the carousel with grey/white color when is resize the window apparently my css it reduces de carousel and looks fine, but if i go directly from an iphone or using mobiletest.me i can see how the site on the mobile is like in a page all thin and the carousel is going out of site, you can see it more specific in http://mobiletest.me/#d=iPhone_5_portrait&u=http://gabouh.com/sitio/
I only need to fix the issue with the responsive of the carousel, i don't know if i should post all my css but if any one could give me an idea of how to make it responsive. Am using bootstrap and am really stuck on how to fix it so any help would be really appreciated.
P.S.: Am already using css mediaquery but still in the resolution of max-width :767px it and adjusting my width of the ul of the carousel to width:100% and doesn't seem to work. If my approach is not good or you know a better one i don't mind checking other ways :D
Thanks again.
i see the code and simply wrap it inside a container and it will work perfect with you.
code:
<div class="container">
...... your carousel code .....
</div>
try this and i hope it will solve your problem.

Elements position changes when i minimize the window

I have a problem with my page. Whenever i minimize the window all the positioning of elements goes off and things get distorted. Please help me. Am using bootstrap elements.
You need to fix a width/min-width to your principal wrap. I think it will fix your problem.
remove the file "bootstrap-responsive.css" from your css files if you're looking for a more "static" website. You might want to read up on responsive design... having a website that isn't responsive helps to alienate potential mobile users... that's just my two cents.

Horizontally centered on a horizontally scrolling page

I'm trying to develop a horizontally scrolling website in which clicking a link in the navigation scrolls the page to the right to the linked div.
The problem is I want the elements that it scrolls to to be horizontally centered within the browser window. I assume that this can be done using javascript, but I have no idea how to go about it.
Here is a pastebin link to my HTML: http://pastebin.com/YxajLvtW
And here is the CSS: http://pastebin.com/JpaJC2Yg
I know how to implement javascript, but not necessarily read/write it.
This should be helpful: http://www.arvindandrion.com/jquery/horizontal-scroll-using-jquery-scrollto/
General advice: Use a Javascript framework like jQuery to code Javascript functionality. It makes life a loooooot easier :)
Maybe take a look at this, too: http://api.jquery.com/scrollLeft/

Resources