윈도우의 오른쪽에있는 요소가 윈도우 크기에 맞게 오버랩되었습니다.

Question

페이지의 왼쪽과 오른쪽에 두 세트의 (jQuery 모바일) 버튼이 있습니다. 왼쪽에서 창을 축소하면 왼쪽 단추 세트가 예상대로 움직이며 자체와 창의 테두리 사이에 약간의 간격을 유지합니다. 그러나 오른쪽면을 축소하면 창은 그면의 단추 집합과 겹칩니다.

어떻게 이것을 피할 수 있습니까? 오른쪽 또는 왼쪽에서 화면 축소 여부에 관계없이 두 세트의 단추가 가로 세로 위치 비율을 유지하도록하고 싶습니다. (아래에서 수축하면 두 단추 세트 모두 창의 위쪽 테두리에서 공간을 유지합니다.)

CSS :

#mainPage{ 
position:relative; 

}

.subMenuClass{ /* right side */ 
display: none; 
position: absolute; 
z-index: 10000; 
top: 2%; 
left:85%; 

}

.mainMenuClass{  /*left side*/ 
display: none; 
z-index: 10000; 
position:absolute; 
top: 2%; 
left: 5%; 

}

Answer 1

.subMenuClass{ /* right side */ 
display: none; 
position: absolute; 
z-index: 10000; 
top: 2%; 
right:5%; /*change to this,you may need to adjust the value*/ 
}