Выравнивание 2 разных iFrames с определенными размерами ширины

Question

Я пытаюсь выровнять 2 разных iFrames на странице, один направо и другой слева. IFrame слева должен иметь ширину 25% и высоту 100%, тогда как iFrame справа должен иметь ширину 75% и высоту 100%. Они помещаются внутри стола с высотой и шириной 100%. Я попытался запустить свой код на JSFiddle.net, и он более или менее выглядит так, как я ожидал, однако он не отображается в моем приложении (он определенно не выровнен 25% -75%). Вот screenshot.

Вот мой фрагмент кода для таблицы:

<table height="100%" width="100%"> 
    <tr style="height:100%"> 

     <td style="width:25%"> 
      <iframe name="ifrTemplateLeftPreview" id="ifrTemplateLeftPreview" width="100%" height="100%"></iframe> 
     </td> 

     <td style="width:75%"> 
      <iframe name="ifrTemplateRightPreview" id="ifrTemplateRightPreview" width="100%" height="100%"></iframe>  
     </td> 

    </tr> 
</table> 

Я попытался заменить «%» с пикселями (пикселей), чтобы установить ширину обоих тегов, однако, казалось, бардак страница вверх немного и похоже, не решает проблему.

Этот код является частью всего ASPX-страницы, и я уверен, что ничего кроме этого фрагмента кода не вызывает проблем с выравниванием iFrames. Я пробовал разные способы, но не помог. Любая помощь будет высоко оценена.

Answer 1

Хорошо, я сам разбирал вопрос. В принципе я изменил <td> 'с до <div>-х и добавил атрибут как плавающие фреймы float:left и что, кажется, отсортировали вопрос:

<table height="100%" width="100%"> 
    <tr> 
    <td> 
     <div style="width:100%"> 

     <div style="width:25%; float:left"> 
     <iframe name="ifrTemplateLeftPreview" id="ifrTemplateLeftPreview" width="100%" height="100%"></iframe> 
     </div> 

     <div style="width:75%; float:left"> 
     <iframe name="ifrTemplateRightPreview" id="ifrTemplateRightPreview" width="100%" height="100%"></iframe>  
     </div> 

     </div> 
    </td> 
    </tr> 
</table>