Как установить размер для div с разными родителями - PullRequest
1 голос
/ 13 мая 2010

Я хочу создать макет div, похожий на следующий результат таблицы:

<html>
    <head>
        <title>Basic</title>
        <style>
            table { border: 1px solid;}
        </style>
    </head>
    <body>
    <table style="border: 1px solid;">
        <tr>
            <td> Asia</td>
            <td>
                <table>
                    <tr>
                        <td>South Asia</td>
                        </td>
                        <td><table>
                                <tr>
                                    <td>Republic</td>
                                    <td><table>
                                            <tr><td>Singapore</td></tr>
                                            <tr><td>India</td></tr>
                                    </table></td>
                                </tr>
                                <tr>
                                    <td>Monarchy</td>
                                    <td><table>
                                            <tr><td>Bhutan</td></tr>
                                            <tr><td>Nepal</td></tr>
                                    </table></td>
                                </tr>
                        </table></td>
                </tr>
                    <tr>
                        <td>East Asia</td>
                        <td><table>
                                <tr>
                                    <td>Republic</td>
                                    <td><table>
                                            <tr><td>China</td></tr>
                                            <tr><td>South Corea</td></tr>
                                    </table></td>
                                </tr>
                                <tr>
                                    <td>Constitutional Monarchy</td>
                                    <td><table>
                                            <tr><td>something</td></tr>
                                            <tr><td>Japan</td></tr>
                                    </table></td>
                                </tr>
                        </table></td>
                    </tr>
            </table></td>
        </tr>
    </table>
    </body>
</html>

Мне удалось воспроизвести это с некоторым усилием. Проблема в том, что я хочу, чтобы названия стран были в столбце или, если хотите, контейнеры для правительственных типов были бы такой же ширины, чтобы другие контейнеры были выровнены.

Если я не сделаю это во вложенных контейнерах (в примере - вложенные таблицы), строки будут смещены. В настоящее время строки показаны именно так, как я хочу - текст находится в середине по вертикали того, к чему они относятся.

Единственное, что мне приходит в голову, это установить текст в тех же столбцах, что и class = column1, class = column2 и т. Д., А затем каким-то образом определить ширину для классов столбцов. Проблема в том, что данные определяются динамически, и я не могу сказать, сколько пикселей или% страницы я могу дать столбцу, мне просто нужно растянуть его вместе с текстом.

Это мой первый раз, когда я спрашиваю о помощи здесь, поэтому, если я делаю это неправильно, скажите мне, как улучшить мой запрос.

РЕДАКТИРОВАТЬ: Я просто прочитал его во второй раз, и я заметил, что мой заголовок не соответствует моему вопросу. Моя вторая идея, чтобы обойти это, состояла в том, чтобы иметь более одного родителя в одном div без родительских отношений между ними, это вообще возможно?

1 Ответ

0 голосов
/ 13 мая 2010

Если вы ищете подходящую сетку для вашего CSS, я настоятельно рекомендую blueprint . Что касается незнания пикселя или% для столбца, это всегда будет проблемой. Можете ли вы «перестраховаться» и просто дать им достаточно большую коробку, чтобы обрабатывать все возможности текста?

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...