2015-01-26 3 views
0

wikicode 및 css가 포함 된 MediaWiki 기사의 절대 위치 (즉, 브라우저 창에 상대적인 위치)는 어떻습니까?MediaWiki의 페이지 제목 옆에 이미지의 절대 위치 지정

내가해야 할 일은 헤더 영역의 빈 공간에 아이콘을 넣는 것입니다. 예를 들어, 내 영화 위키의 "Star Trek"기사에서 Star Trek 로고를 위의 두 번째 로고, 즉 위키의 로고 옆에 배치하여 우리 내부의 하위 사이트에 있다는 인상을 주려고합니다. wiki, 해당 하위 사이트의 홈 페이지, Star Trek 포털에 링크. 등등; 영화의 각 그룹마다 다른 로고 (X-Files, Star Wars 등)가있을 것입니다. 따라서이 작업은 간단한 템플리트로 수행해야하며 스킨 (Vector btw)을 건드리지 않아야합니다.

나는

<div style=" 
position: absolute; 
top: 0px; 
left: 0px; 
z-index: 100;>{{logo}}</div> 

을 시도했지만 한 내용 영역, 하지 브라우저 창 왼쪽 상단이 절대 위치 로고!

나는 또한이 모든 것을 가능한 모든 위치 지정 및 표시를 가진 다른 컨테이너 div에 넣으려고했으나 아무리 내용 영역을 벗어날 수없는 것 같습니다.

내가 발견 한 workaround는 top-150px;으로 변경하여 로고가 원하는 위치로 이동하도록하는 것입니다. 그러나 콘텐츠 영역이 인 경우 실제로는 이므로 기사의 제목이 너무 크고 두 줄로 나뉘면 로고는 이동 한 콘텐츠 영역 다음의 낮은 위치에 나타납니다.

내 생각 엔 MediaWiki는 콘텐츠 영역이 브라우저 창이나 다른 것으로 작동하도록하는 코드를 사용합니다. 그렇다면이 문제를 무시할 수있는 방법이 있습니까? 아마도 LocalSettings.php 스위치로?

+0

요소를 절대 배치하지 않도록 마크 업 또는 다른 것을 편집 할 수 있습니다. 'position : absolute'는 다음 상대적으로 위치하는 부모쪽으로 절대적 일 것이기 때문에 솔루션이 깨져 있습니다. –

+0

빠른 답장을 보내 주셔서 감사합니다! 그것은 올바른 방향으로 나를 가리 킵니다! 나는 상대적인 위치를 찾기 위해 부모의 사슬을 조사해야한다는 것을 깨달았다. MediaWiki : Common.css에서'.mw-body-content' 클래스를 찾아 position : static으로 설정 했으므로 이제 로고의 절대 위치가 원하는대로 작동하는 것 같습니다! 이 변화가 피부의 완전성을 손상시키지 않기를 바랍니다. 지금까지 '정적'문제는 발견하지 못했습니다. 어쩌면 벡터 경험이있는 사람이라면 괜찮은지 알 수 있습니다. – Protonotarios

+0

창 크기를 조정하여 창문이 잘 보이는지 확인하십시오. 내 의견을 답변으로 바꾸어서 올바른 것으로 표시 할 수 있습니다. –

답변

1

일반적으로 position: absolute을 피하십시오. 창 크기가 바뀔 때 In은 중단되는 경향이 있습니다.

position: absolute이 다음 상대적으로 위치하는 부모에게 절대적 일 것이기 때문에 시도가 어쩌면 깨고 있습니다. 해당 특정 요소에 대한 DOM 트리로 이동하여 relative에 위치한 상위 항목을 찾으십시오.

1

MediaWiki 1.25 이상에서는 page indicators을 사용해야합니다.

필요한 이미지는 이고, 해당 이미지가있는 것으로 가정하면 {{logo}}입니다.

+0

Thanks Nemo! 나는 여전히 1.25 미만이지만 페이지 표시기는 훌륭한 기능 추가이며 사이트에 로고/이미지를 추가하려는 사람들에게 더 쉽게 사용할 수 있다고 생각합니다. 그리고 헤더의 다른 곳에두기를 원한다면, 인디케이터 위치는 인디케이터 위치가 훨씬 쉽습니다. 인디케이터는 페이지 제목이 한 줄 또는 여러 줄인지에 관계없이 맨 위에서 고정 된 거리를 가지고 있기 때문입니다. – Protonotarios