Поддержка Проблемы и решения Как разместить 3 маленькие таблицы в одну строку?

  • Доброго времени суток! Создала 6 таблиц в TablePress, они маленькие(по 2столбца). Как мне разместить 3 маленькие таблицы в одну строку, следующие 3 в другую строку и чтобы они не были такими большими как сейчас? (Примерно как на сайте прядки в порядке мне надо)

    Страница, с которой нужна помощь: [войдите, чтобы увидеть ссылку]

Просмотр 12 ответов — с 1 по 12 (всего 12)
  • пальцем ткните.
    ибо я ничего подобного на указанном сайте не вижу.

    а вообще, размещать таблицы в таблицах очень плохая идея — сдается мне, что на мобильных все расплывется и будет выглядеть кучей мусора.

    не хочу я таблицы в таблицах размещать, мне надо чтобы 3таблицы рядом друг с другом стояли, а не так чтоб друг под другом в один столбец

    
    <div style="flex-wrap:wrap;display:flex;">
    
    <table style="width:250px!important;">
    код таблицы
    </table>
    
    <table style="width:250px!important;">
    код таблицы
    </table>
    
    <table style="width:250px!important;">
    код таблицы
    </table>
    
    </div>
    

    будут таблицы располагаться в ряд. если места достаточно.

    это надо писать в css пользователя в TablePress? Если у меня там Стиль CSS такой, то куда его приписать?

    table {
    font-family: "Lucida Sans Unicode", "Lucida Grande", Sans-Serif;
    font-size: 14px;
    border-radius: 10px;
    border-spacing: 0;
    text-align: center;
    }
    th {
    background: #BCEBDD;
    color: white;
    text-shadow: 0 1px 1px #2D2020;
    padding: 10px 20px;
    }
    th, td {
    border-style: solid;
    border-width: 0 1px 1px 0;
    border-color: white;
    }
    th:first-child, td:first-child {
    text-align: left;
    }
    th:first-child {
    border-top-left-radius: 10px;
    }
    th:last-child {
    border-top-right-radius: 10px;
    border-right: none;
    }
    td {
    padding: 10px 20px;
    background: #F8E391;
    }
    tr:last-child td:first-child {
    border-radius: 0 0 0 10px;
    }
    tr:last-child td:last-child {
    border-radius: 0 0 10px 0;
    }
    tr td:last-child {
    border-right: none;
    }
    • Ответ изменён 4 года, 8 месяцев назад пользователем gulshatkakutueva.

    нет, это в запись (в режиме текста).
    аля:

    
    <div style="flex-wrap:wrap;display:flex;">
    
    [шорткод таблицы 1]
    
    [шорткод таблицы 2]
    
    [шорткод таблицы 3]
    
    </div>
    

    а в стилях tablepress прописать:

    
    table {
    width:250px!important;
    font-family: «Lucida Sans Unicode», «Lucida Grande», Sans-Serif;
    font-size: 14px;
    border-radius: 10px;
    border-spacing: 0;
    text-align: center;
    }
    

    не помогло((( все равно все таблицы в один ряд

    ааааа, помогло!!! я не туда писала. только вот теперь опять вопрос: как теперь вторую партию таблиц правильно разместить чтобы 4я под 1м, 5я под 2м, 6я под 3м был и чтобы сильно расстояния не было между верхними и нижними таблицами

    вот на другом сайте, как я поняла, как блоками они размещены. мне примерно так же надо

    <div class="pricing">
    			<!--<pre>-->
    <!--</pre>-->
    	<div class="pricing-block big_block" id="bx_1847241719_143">
    		<div class="title pricing_title">
    			<div class="icon icon-girl">
    				<a href="#" data-pk="143">Женский зал</a>
    			</div>
    		</div>
    				
        <table>
                                    <tbody><tr>
                <td>Короткие волосы</td>
                <td>350р</td>
            </tr>
                                    <tr>
                <td>Средние/длинные волосы</td>
                <td>450р</td>
            </tr>
                                    <tr>
                <td>Укладка волос</td>
                <td>400/750/750р</td>
            </tr>
                                    <tr>
                <td>Маска для волос</td>
                <td>200р</td>
            </tr>
                                    <tr>
                <td>Молекулярный коктейль от MATRIX</td>
                <td>250р</td>
            </tr>
                                    <tr>
                <td>Прическа</td>
                <td>1100р</td>
            </tr>
                                    <tr>
                <td>Плетение</td>
                <td>300р</td>
            </tr>
                                    <tr>
                <td>Цветные пряди (1 прядь)</td>
                <td>100р</td>
            </tr>
                                    <tr>
                <td>Окрашивание/тонирование (1 тон) ESTEL</td>
                <td>800/1200/1500р</td>
            </tr>
                                    <tr>
                <td>Окрашивание/тонирование (1 тон) MATRIX</td>
                <td>950/1500/1800р</td>
            </tr>
                </tbody></table>
    	</div>
    	<div class="pricing-block small_block" id="bx_1847241719_142">
    		<div class="title pricing_title">
    			<div class="icon icon-moustache">
    				<a href="#" data-pk="142">Мужской зал</a>
    			</div>
    		</div>
    				
        <table>
                                    <tbody><tr>
                <td>Бокс/полубокс/спортивная/окантовка с переходом</td>
                <td>210р</td>
            </tr>
                                    <tr>
                <td>Молодежная/Модельная/Теннис</td>
                <td>310р</td>
            </tr>
                                    <tr>
                <td>Креатив</td>
                <td>450р</td>
            </tr>
                                    <tr>
                <td>Наголо</td>
                <td>100р</td>
            </tr>
                                    <tr>
                <td>Оформление бороды</td>
                <td>150р</td>
            </tr>
                        </tbody></table>
    	</div>
    	<div class="pricing-block small_block last-in-line" id="bx_1847241719_141">
    		<div class="title pricing_title">
    			<div class="icon icon-boy">
    				<a href="#" data-pk="141">Детский зал до 7 лет</a>
    			</div>
    		</div>
    				
        <table>
                                    <tbody><tr>
                <td>Спортивная</td>
                <td>200р</td>
            </tr>
                                    <tr>
                <td>Модельная</td>
                <td>270р</td>
            </tr>
                                    <tr>
                <td>Креативная</td>
                <td>350р</td>
            </tr>
                                    <tr>
                <td>Креативная со сложным рисунком</td>
                <td>500р</td>
            </tr>
                                    <tr>
                <td>Прическа</td>
                <td>700р</td>
            </tr>
                </tbody></table>
    	</div>
    	<div class="pricing-block small_block bottom" id="bx_1847241719_140">
    		<div class="title pricing_title">
    			<div class="icon icon-bottle">
    				<a href="#" data-pk="140">Маникюр</a>
    			</div>
    		</div>
    				
        <table>
                                    <tbody><tr>
                <td>Маникюр+покрытие лаком</td>
                <td>450р</td>
            </tr>
                                    <tr>
                <td>Маникюр женский</td>
                <td>300р</td>
            </tr>
                                    <tr>
                <td>Маникюр+гель-лак</td>
                <td>790р</td>
            </tr>
                                    <tr>
                <td>Педикюр женский</td>
                <td>800р</td>
            </tr>
                                    <tr>
                <td>Педикюр на пальчики+гель-лак</td>
                <td>790р</td>
            </tr>
                        </tbody></table>
    	</div>
    	<div class="pricing-block small_block last-in-line bottom" id="bx_1847241719_139">
    		<div class="title pricing_title">
    			<div class="icon icon-sun">
    				<a href="/solarium/" data-pk="139">Солярий</a>
    			</div>
    		</div>
    				
        <table>
                                    <tbody><tr>
                <td>Стоимость 1 минуты при разовом посещении</td>
                <td>15р</td>
            </tr>
                                    <tr>
                <td>40 минут</td>
                <td>500р</td>
            </tr>
                                    <tr>
                <td>100 минут</td>
                <td>1000р</td>
            </tr>
                                    <tr>
                <td>200 минут</td>
                <td>1500р</td>
            </tr>
                </tbody></table>
    	</div>
    		</div>
    • Ответ изменён 4 года, 8 месяцев назад пользователем gulshatkakutueva.
    
    <div style="flex-wrap:wrap;display:flex;">
    
    [шорткод таблицы 1]
    
    [шорткод таблицы 2]
    
    [шорткод таблицы 3]
    
    </div>
    <div style="flex-wrap:wrap;display:flex;">
    
    [шорткод таблицы 4]
    
    [шорткод таблицы 5]
    
    [шорткод таблицы 6]
    
    </div>
    

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

    поможет ли разбивка главной страицы на три колонки, а потом на плитки?

    с помощью плагина Page Builder by SiteOrigin оформила страницу так, как надо мне. Спасибо, Flector, за попытку помочь

Просмотр 12 ответов — с 1 по 12 (всего 12)
  • Тема «Как разместить 3 маленькие таблицы в одну строку?» закрыта для новых ответов.