응답 테이블이 스택 됨

Question

Magento v1.8을 사용하여 반응 형 웹 사이트를 만들고 있으며 응답 헤더를 응답으로 만드는 문제에 직면 해 있습니다. div로 시도했지만 제대로 작동하지 못했습니다. 나는 테이블 방법으로 갔고, 거기에 1/2의 길을 가지고 있었다. 그러나 아직도 일부 이슈에 달리기.

이

[___ 로고 ____가] [___ 검색 _____] [___ Cart_____] (100 % 화면 폭) 해상도 (모바일/테이블)로

그것이

로 변경 한 :

이

내가 달성하기 위해 무엇을 찾고있다

[___Logo_______]

[___Search_____]

[___Cart________]

지금 현재로는 길의 3/4을 무너 뜨리고 카트가 화면에서 벗어납니다. 줄이면 화면이 축소됩니다 (정렬은 꺼져 있지만 계속됩니다).

<style> 


@media screen and (max-device-width: 600px), screen and (max-width: 600px) { 
*[class=headermobilewrapper]{width:100%!important; height:auto!important;} 
*[class=w320]{width:320px!important; height:auto!important;} 
*[class=split]{width:320px!important; float:left!important; display:block !important;} 



</style> 


<?php $config = Mage::getStoreConfig('themessettings', $_GET['store']); ?> 


<table width="100%" border="0" cellspacing="0" cellpadding="0" class="headermobilewrapper" align="center" bgcolor="#f3faf0"> 
    <tr> 
    <td style="vertical-align:middle" class="split"> <a href="http://dev2"><img src="/images/header/header_logo.gif" ></a> </td> 
    <td style="vertical-align:middle" align="center" class="split"> <?php echo $this->getChildHtml('topSearch'); ?> </td> 
    <td style="vertical-align:middle" align="center" class="split"> <?php echo $this->getChildHtml('cartTop') ?> </td> 
    </tr> 
</table> 

중 내가 비록 내가 거의 모든 나는 Google에서 발견, 여기에 방법, 내가 시도 등의 포맷 스타일을 변경 아무런 문제가 없을 : 여기

는 내가 지금까지 무엇을 가지고 뭔가 잘못하고있는 것, 아니면 내가 성취하고자하는 것이 아직 거기에 없다는 것입니다.

Answer 1

당신은 당신이 그들의 미디어 쿼리보고 거기에서 몇 가지 포인터를 받고 어쩌면 트위터 부트 스트랩을 사용하거나 봤어 table, td, trdisplay: block

@media 
only screen and (max-width: 760px), 
(min-device-width: 768px) and (max-device-width: 1024px) { 
    table, tr, td { 
     display: block; 
    } 
} 

http://jsfiddle.net/3ernd8up/