2012-05-05 2 views
0

내가 여기 해본 적이 거의 같은 메뉴를 스트레칭하기 위해 노력하고있어이 : Stretch horizontal ul to fit width of div크로스 브라우저 스트레치 메뉴 항목 실제 항목

만 나는 실제 텍스트, 매우에되도록 그것을 만들려고 해요 왼쪽과 오른쪽 (이제는 포함하는 리가 늘어나지 만 텍스트는 중앙에 위치 함)

예제에 대한 링크는 무엇입니까? :) CSS/테이블은 모든 브라우저에서 작동하는 한 중요하지 않습니다. :)

은 다음과 같습니다. http://www.alisso.se/wordpress/uploads/2012/05/spread-menu.png

+0

왼쪽 링크가 정렬 된 상태에서 http://jsfiddle.net/trickeedickee/q3XPQ/을 의미합니까? 나는 너의 질문에 약간 혼란스러워. – frontendzzzguy

+0

거의 그처럼 나는 주변의 회색 영역 대신 실제 단어를 컨테이너처럼 똑같이 배포하고 싶습니다. 첫 번째 단어 만 맨 왼쪽에 있어야하며 마지막 단어는 바로 오른쪽에 있어야합니다. 당신에게 이미지를 보여줄 것입니다! – Alisso

+0

[link] (http://www.alisso.se/wordpress/uploads/2012/05/spread-menu.png) – Alisso

답변

2

내가 원하는 스타일을 달성 할 수 있도록 jsfiddle을 설정했습니다. http://jsfiddle.net/trickeedickee/Kkngn/ 첫 번째 및 마지막 클래스를 추가로 사용했습니다. 나는 첫 자녀와 마지막 자녀를 사용할 수 있었지만 그것을 지나치게 복잡하게 만들고 싶지는 않았습니다.

이 기능이 작동하는지 알려주세요. 그렇지 않은 경우 더 도와 드리겠습니다.

+0

정말 멋지다. 정말 효과적이다. 나는 완전히 이해합니다. first.child & : last-child, 일부 브라우저에서는 마지막으로 아이가 몇 번 작동하지 않는다는 것을 알고 있지만, 이것은 환상적입니다. 왜 내가 이런 식으로 생각하지 않았는지 모르겠다! 정말 고맙습니다! : D – Alisso

+0

나는 display : table-cell; IE에서 작동합니까? – Alisso

+0

나는 그것이 거의 확실하다고 생각한다. 내일 직장에서 확인해 볼게. 기꺼이 도와 드리겠습니다. 그리고이 솔루션이 다른 사람들을 동일하거나 유사한 문제로 도울 수 있기를 바랍니다. – frontendzzzguy