Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I hope someone can help me with this, I've been searching in my CSS whats wrong but can't figure it out.
If you look at this website: http://viversa.nl/v2/index.html , and click a bit threw the pages, you'll notice some jumping between sites. You'll notice it specially if you click from 'Projecten' to 'People' and back.
It seems "HOME" and "PROJECTEN" are the same, with both a good layout. Next to "OVER ONS", "PEOPLE", "CONTACT" and "SITEMAP" which have a good layout together aswell. But I can't figure out whats wrong and how its possible its jumping, since I simple copied the menu + logo pages + css.
Hope someone can help me out with this!
Thanks!
Sincerely, Stefan
The problem is that the project-page is longer than the screen, thus causing the vertical scroll-bar to appear. Since you are centering the layout and the scroll-bar takes up 20px or so of the space used for your site, what is considered as the center will "move" slightly when the scroll-bar appears.
To get rid of the jumping, you can force the vertical scroll-bar to always be visible:
html {
overflow-y: scroll;
}
The difference is the browser scrollbar. Short pages that don't require scrolling have a slightly wider space available to them compared to longer pages that can be scrolled.
Seems like you got too much text for your images that are only 410px in Height, maybe delete some text or make your background images longer and added some min-height into the CSS?
Related
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed yesterday.
Improve this question
So, I need to align buttons in the middle of menu, after they move to next line. I'm pretty new to wordpress and css, but already have tried "few solutions" from internet and my own ideas.
Site URL: http://katemosr.beget.tech/
The first thing i tried was "text-align: center", but it did nothing. So I decided to change it to "align-items: center" - same result. After that i started looking and messing around the whole header css changing things to "center", editing max width - no result.
Finally I've decided to change float to "right" and it had some kind of result. Every button moved to right even on the second line. So I immediately decided to change it to "center" and the whole menu went vertical. Of course that wasn't the result I was looking for but finally something has changed.
Hope someone can help me with it!
Thanks in advance!
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
On the website http://www.northkingdom.com/, when the browser window is narrower than 568 pixels (or on mobile), and you click on the menu button in the top right corner, there is a narrow, vertical, white space to the right of the list:
What creates this white space?
I cannot find any CSS rules or page elements that keep the menu from sitting at the right edge of the screen.
Any help very much appreciated!
The problem is an overflow-y:scrollin here:header.mobile-menu #nav.
That white space is actually a scrollbar. You can replace it with auto instead of scroll
Thats a scrollbar, not a white space. Add this to your css of your ul and you will not have the problem anymore
overflow: hidden;
Closed. This question needs details or clarity. It is not currently accepting answers.
Want to improve this question? Add details and clarify the problem by editing this post.
Closed 8 years ago.
Improve this question
I have this weird white line on my front page that wont be removed. I loocked and cant find what it is. the site is responsive and it looks even weirder on on the cellphone. Can someone help me?
Well you have a couple issues. The quickest and easiest fix is to update the css class
gdlr-header-inner
add background-color:transparent;
That is the first issue is the background is white.
The next fix I would do as an easy fix is to look at the div right after the closeing header tag it should have the class content-wrapper.
To that div I would add margin-top:-95px;
At the end of the day the issue is your header is larger then the top part of the image. I wonder if you should merge the two images and set the background color and the background image to the body tag. Then you wouldn't have to worry about it. You then could still push the top down x pixels
http://www.w3schools.com/cssref/pr_background-position.asp
For starters, the div your logo is in along with its padding are too big for the header.
So it's pushing the rest of the page down.
Try changing the top and bottom padding on the gdlr-logo div.
You have a problem with the height of some elements, like:
.gdlr-logo {margin-top: 26px;}
Try to remove some margins and review the height of elements on the header.
Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
In my attempt to be terribly clever and have my #secondary sidebar sit on top of the slideshow on my homepage, I have somehow made the area dangle over the #wrapper on all the secondary pages. Have added a removed a whole bunch of div tags, nudged things around and tried everything else I can think of. Anyone have a suggestion how to fix this?
This is the homepage: http://emgraphics.net/joyful/ and the sidebar dangles on any other page (the shame!) Thanks!
You won't have a problem once you add content to those pages, though. Not sure what the issue is. An absolutely positioned element is taken out of the document flow, so the wrapper will not take any notice of the sidebar. You could alternatively float it and give it a negative top margin on the home page.
Closed. This question needs to be more focused. It is not currently accepting answers.
Want to improve this question? Update the question so it focuses on one problem only by editing this post.
Closed 8 years ago.
Improve this question
I recently made a website for a church. I used Foundation, SASS, and Compass. I've almost got it finished up when I notice that if you size the window down I get a horizontal scroll. So I add overflow-x: hidden; I thought that fixed it but when I tested it on my iPad I am still getting roughly 20px of padding on the right side. I then thought maybe it was from the box-shadow which made sense so I removed all the box shadows and its still there. Here is the link: http://www.jessefoutch.com/fumc/ any help would be appreciated.
Foundation already has its own set padding and margin for grid-columns and other grid elements. You can either change these parameters in the _settings.scss file in Foundation, or you can set the padding or margins to 0 manually and that should fix any of your issues. I checked and didn't actually see the issue you were speaking of however, so it may no longer be affecting your site
Perhaps you need to clear your cache. I have looked at the site in Firefox, Safari, and Chrome and only saw the standard browser scroll bar when I resized.