Reputation: 1068
I have four <div>
. One of them is not displayed using display:none
and is only displayed once you click an icon. When the item is clicked jQuery toggle function is called. One <div>
is set to display:none
and the one which was previously hidden is displayed. This is working perfectly but for some odd reason the page content moves 10 pixels or so up on toggle. I don't know what's causing it as all the <div>
have same css and classes. Here is the css:
element.style {
margin-right: 5px;
margin-left: 10px;
left: 0px;
display: block;
}
#contactus {
background-color: #DDD;
position: relative;
position: relative;
left: 0;
}
@media (min-width: 1200px)
.span4 {
margin-left: 5px;
width: 320px;
}
span4 is the class for the toggled divs. Element styling is also the same. Can any one give me a hint what is causing this behavior. Here is the url: http://contestlancer.com/davidicus/ You can see it the problem if you click on message icon besides the logo heading.
Ahmar.
Upvotes: 1
Views: 1100