bootstrap + шаблон

tazam · March 16, 2014

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

TopRaN · March 16, 2014

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

если внимательно посмотреть шаблон , то можно понять, что к шаблону подключен bootstrap))

doma · November 12, 2018

В 16.03.2014 в 05:44, TopRaN сказал:

если внимательно посмотреть шаблон , то можно понять, что к шаблону подключен bootstrap))

Подскажите а как можно стандартное расстояние между кнопками btn изменить на свое ? смотрели стили и там что то ничего не нашли, сейчас если делать кнопки по горизонтали, причем убрать все возможные margin все равно справа есть расстояние, а вот в стилях его нет, хотели добавить margin: 0px 2px 2px 0px? чтобы все было корретно, так как если сейчас это не делать то при 2-3 строках кнопок они накладываются друг на друга

TopRaN · November 12, 2018

Написать свой класс и обернуть им кнопки. Не нужно изобретать велосипед.

doma · November 12, 2018

34 минуты назад, TopRaN сказал:

Написать свой класс и обернуть им кнопки. Не нужно изобретать велосипед.

я понимаю что можно использовать свои стили, но вопрос не в этом. если даже мы и допишем свой стиль, проблему это не решит. если даже поставить margin=0px? то все равно справа будет отступ,
вопрос как изменить этот отступ и сделать более его правильным, так как всплыл некий баг в оформлении.
пример если поместить кнопку например в table то кнопка не совсем корректно помещается в него, по сути в table тоже должен быть отступ от края, но по факту его нет. и немного не красиво получается

Chernetskiy · November 15, 2018

В 12.11.2018 в 14:34, doma сказал:

я понимаю что можно использовать свои стили, но вопрос не в этом. если даже мы и допишем свой стиль, проблему это не решит. если даже поставить margin=0px? то все равно справа будет отступ,
вопрос как изменить этот отступ и сделать более его правильным, так как всплыл некий баг в оформлении.
пример если поместить кнопку например в table то кнопка не совсем корректно помещается в него, по сути в table тоже должен быть отступ от края, но по факту его нет. и немного не красиво получается

Перейди к конкретике, что именно и где именно надо сделать? Отступ может быть определен как стилями для конкретного элемента (кнопки) так и возможно присутствующими на фронтэнде блоками (типа 1/2, 1/4 и т.п.), которые сами по себе могут иметь собственное оформление. Соответственно новые стили могут кардинально вопрос не решить, если ваша кнопка окажется внутри подобного блока. Посмотрите структуру кода выше - до уровня блоков, может на этом уровне и найдете решение с отступами.

doma · November 16, 2018

10 часов назад, Chernetskiy сказал:

Перейди к конкретике, что именно и где именно надо сделать? Отступ может быть определен как стилями для конкретного элемента (кнопки) так и возможно присутствующими на фронтэнде блоками (типа 1/2, 1/4 и т.п.), которые сами по себе могут иметь собственное оформление. Соответственно новые стили могут кардинально вопрос не решить, если ваша кнопка окажется внутри подобного блока. Посмотрите структуру кода выше - до уровня блоков, может на этом уровне и найдете решение с отступами.

Вот конкретика. одна из тех что уже неоднократно писалась на форуме, но 70% по факту остается без ответа и решений не находит.
Вот скриншоты, если данные кнопки использовать в строку то между ними есть расстояние, а вот если сверху вниз то такого отступа уже нет. если мы к кнопке добавляем какое нибудь значение margin в любой вариации (например отступ только снизу или отступ справа, или одновременно снизу+справа ) , то это вызывает дополнительные сложности при размещении, так как располагаются данные кнопки например в таблице не совсем корректно. Поэтому и спрашивали где эти поля корректно посмотреть и где они настраиваются, чтобы попробовать добавить такой же промежуток еще и при расположении сверху вниз, чтобы с точки зрения дизайна смотрелось все грамотно

TopRaN · November 16, 2018

Я же вам написал, что кнопку нужно обернуть в свой стиль. Если вы будете напрямую редактировать стили кнопки, то это затронет все кнопки на сайте

doma · November 16, 2018

49 минут назад, TopRaN сказал:

Я же вам написал, что кнопку нужно обернуть в свой стиль. Если вы будете напрямую редактировать стили кнопки, то это затронет все кнопки на сайте

а я же вам написал :))) что если даже и буду использовать свой стиль, то это не решает проблему -я прежде чем написать многое попробовал самостоятельно, но это не решает столь главной задачи. если я даже применю margin 0px то расстояние между кнопками не уменьшается, вот и хотел спросить где в стилях это расстояние находится ?
мне нужно чтобы именно все кнопки на сайте коснулись изменения. поскольку это общий баг -бустрап кнопок, а вот как его грамотно решить даже в интернете решения не нашел. прошу подсказать что и где править и в каком месте и если не сложно как (конкретное решение).

TopRaN · November 16, 2018

1. Это не баг.

2. Имея элемент А у которого есть свойстаа pading и margin. Данные свойства применяются только к элементу А. Если его обернуть в элемент Б, то можно манипулировать свойствами pading и margin элемента Б, не трогая элемент А. Т.е. ваша кнопка будет вложена в див элемента элемента Б. Таким образом увеличиваем или уменьшаем отступы и расстояния. Это с точки грамотного исполнения дизайна!

3. Чтобы система приняла свойства в первую очередь, как основное использовать нужно параметр !important.

4. Это основа css.

5. То что изменяется для одного элемента 100% затрагивает изменения всех типов данного элемента в разных разрешениях . Responsive.

doma · November 16, 2018

17 минут назад, TopRaN сказал:

1. Это не баг.

2. Имея элемент А у которого есть свойстаа pading и margin. Данные свойства применяются только к элементу А. Если его обернуть в элемент Б, то можно манипулировать свойствами pading и margin элемента Б, не трогая элемент А. Т.е. ваша кнопка будет вложена в див элемента элемента Б. Таким образом увеличиваем или уменьшаем отступы и расстояния. Это с точки грамотного исполнения дизайна!

3. Чтобы система приняла свойства в первую очередь, как основное использовать нужно параметр !important.

4. Это основа css.

5. То что изменяется для одного элемента 100% затрагивает изменения всех типов данного элемента в разных разрешениях . Responsive.

частично то что вы написали я понимаю и знал и понимал. но я так и не понял где поправить этот промежуток между кнопками, почему например он равен 2 px? а не 5-10-15 или1 где его можно посмотреть и поправить, там все дело в том что сколько я не искал где это задается, так и не нашел,
по поводу пункта 2 -в том то и дело что у кнопки нет margin по умолчанию ни с какой стороны, но все равно отступ справа существует. может быть это задается где то где расписан стиль типа .btn+.btn ???

относительно вложения элемента А в элемент Б это не совсем то решение/ попробуйте сами на шаблоне реалия разместить
1) сначала длину слева направо -увидите промежутки
2) а теперь попробуйте разместить две и более кнопки сверху вниз -увидите результат как на фото, а вот как грамотно все же их сделать требуемые отступы ?

TopRaN · November 16, 2018

7 часов назад, doma сказал:

относительно вложения элемента А в элемент Б это не совсем то решение

Если вам не подходит данное решение и у вас своё мнение об этом то напишите т.з. в раздел фриланс. Вам сделают все на основании ваших требований и тех. Задания.

doma · November 17, 2018

9 часов назад, TopRaN сказал:

Если вам не подходит данное решение и у вас своё мнение об этом то напишите т.з. в раздел фриланс. Вам сделают все на основании ваших требований и тех. Задания.

у меня
1) ни свое мнение
2) ни решение

у меня вопрос. довольно простой -как и где подправить отступы между кнопками :))

Chernetskiy · November 18, 2018

В 17.11.2018 в 10:52, doma сказал:

у меня
1) ни свое мнение
2) ни решение

у меня вопрос. довольно простой -как и где подправить отступы между кнопками :))

Философствовать можно долго, лучше сообщи название сайта, где это чудо присутствует. И попутно, какой версии Бутстрап?

Наверняка присутствует глобальный стиль, который отвечает за все кнопки или большинство из них.

doma · November 18, 2018

1 час назад, Chernetskiy сказал:

Философствовать можно долго, лучше сообщи название сайта, где это чудо присутствует. И попутно, какой версии Бутстрап?

Наверняка присутствует глобальный стиль, который отвечает за все кнопки или большинство из них.

Не философствую - сделал у вас на сайте )) у вас то есть промежуток -то его нет.
версия бутстрап 2
вот пример на вашем сайте

doma · November 18, 2018

2 часа назад, Chernetskiy сказал:

Философствовать можно долго, лучше сообщи название сайта, где это чудо присутствует. И попутно, какой версии Бутстрап?

Наверняка присутствует глобальный стиль, который отвечает за все кнопки или большинство из них.

В 17.11.2018 в 01:12, TopRaN сказал:

Если вам не подходит данное решение и у вас своё мнение об этом то напишите т.з. в раздел фриланс. Вам сделают все на основании ваших требований и тех. Задания.

впрочем как обычно мне все стало понятно - решения не ищется и все приходится делать самому и самому экспериментировать.
Входе длительных экспериментов, на разных сайтах и на разных примерах, решение лично для меня "как бы найдено", впрочем правильно ли оно или нет - все равно ни кто ничего не ответит :))

Поэтому если вам самим интересно, вот вам скриншоты -посмотрите почему в одном случае отступы есть, а в другом нет
поломайте голову - может быть не будете меня посылать :)))

просто кнопки - ни каких дополнительных style к ним не применены - все стандартно ко всем кнопкам - <a class="btn btn-primary">11</a>

Chernetskiy · November 19, 2018

23 часа назад, doma сказал:

впрочем как обычно мне все стало понятно - решения не ищется и все приходится делать самому и самому экспериментировать.
Входе длительных экспериментов, на разных сайтах и на разных примерах, решение лично для меня "как бы найдено", впрочем правильно ли оно или нет - все равно ни кто ничего не ответит :))

Поэтому если вам самим интересно, вот вам скриншоты -посмотрите почему в одном случае отступы есть, а в другом нет
поломайте голову - может быть не будете меня посылать :)))

просто кнопки - ни каких дополнительных style к ним не применены - все стандартно ко всем кнопкам - <a class="btn btn-primary">11</a>

Вот у себя-же на сайте поэкспериментировал:

Код кнопок:

<div class="span9">
    <h1 class="page-header">Продажа 1 комн. квартиры в Островцах, Раменский район Московской области за 3 350 000 ₽</h1>
      <div class="editblock">
    <a title="На главную" href="/" class="btn btn-info"><i class="icon-white icon-home"></i></a>
    <a title="Назад" href="#" onclick="history.back();return false;" class="btn btn-info"><i class="icon-white icon-chevron-left"></i> Назад</a>
    <a title="Печать" href="#" onclick="window.print()" class="btn btn-info"><i class="icon-white icon-print"></i></a>
    <a title="Редактировать" href="/account/data/?do=edit&id=178" class="btn btn-warning"><i class="icon-white icon-pencil"></i></a>
    <a title="Удалить" href="/account/data/?do=delete&id=178" class="btn btn-danger"><i class="icon-white icon-remove"></i></a>
    ... Добавил в код к имеющимся кнопкам над фото объявления ...
    <a class="btn btn-info">Кнопка</a> 
    <a class="btn btn-warning">Кнопка</a> 
    <a class="btn btn-danger">Кнопка</a> 
    <a class="btn btn">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a>
  </div>
    ...
</div>

В стилях к кнопкам добавил параметр margin-bottom: 5px; и появились нужные промежутки. Файл /realia/css/realia-blue.css, строка 4348

Итог на скриншоте:

В моем случае кнопки сидят в кастомном блоке <div class="editblock">, если используете стандартные блоки, то у них есть свои стили, как и у стандартных кнопок.

doma · November 19, 2018

40 минут назад, Chernetskiy сказал:

Вот у себя-же на сайте поэкспериментировал:

Код кнопок:


<div class="span9">
    <h1 class="page-header">Продажа 1 комн. квартиры в Островцах, Раменский район Московской области за 3 350 000 ₽</h1>
      <div class="editblock">
    <a title="На главную" href="/" class="btn btn-info"><i class="icon-white icon-home"></i></a>
    <a title="Назад" href="#" onclick="history.back();return false;" class="btn btn-info"><i class="icon-white icon-chevron-left"></i> Назад</a>
    <a title="Печать" href="#" onclick="window.print()" class="btn btn-info"><i class="icon-white icon-print"></i></a>
    <a title="Редактировать" href="/account/data/?do=edit&id=178" class="btn btn-warning"><i class="icon-white icon-pencil"></i></a>
    <a title="Удалить" href="/account/data/?do=delete&id=178" class="btn btn-danger"><i class="icon-white icon-remove"></i></a>
    ... Добавил в код к имеющимся кнопкам над фото объявления ...
    <a class="btn btn-info">Кнопка</a> 
    <a class="btn btn-warning">Кнопка</a> 
    <a class="btn btn-danger">Кнопка</a> 
    <a class="btn btn">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a> 
    <a class="btn btn-primary">Кнопка</a>
  </div>
    ...
</div>

В стилях к кнопкам добавил параметр margin-bottom: 5px; и появились нужные промежутки. Файл /realia/css/realia-blue.css, строка 4348

Итог на скриншоте:

В моем случае кнопки сидят в кастомном блоке <div class="editblock">, если используете стандартные блоки, то у них есть свои стили, как и у стандартных кнопок.

Эх вообще не туда :))) это мы все знали - я спрашивал как редактировать создающиеся отступы если margin=0.
я уже не знаю как всем все объяснять - объясняю вроде понятно и однозначно и вроде понятно. но всЁ - видимо охотно меня тролят :)) и умышленно выставляют дураком.
Например у меня margin=0px но все равно расстояние между кнопками имеется/вот это и спрашивалось - как это расстояние редактировать-уменьшитьилиувеличить

Chernetskiy · November 20, 2018

11 час назад, doma сказал:

Эх вообще не туда :))) это мы все знали - я спрашивал как редактировать создающиеся отступы если margin=0.
я уже не знаю как всем все объяснять - объясняю вроде понятно и однозначно и вроде понятно. но всЁ - видимо охотно меня тролят :)) и умышленно выставляют дураком.
Например у меня margin=0px но все равно расстояние между кнопками имеется/вот это и спрашивалось - как это расстояние редактировать-уменьшитьилиувеличить

doma, сам-то понял чего хочешь? Хочу отступы, но чтобы отступы были нулевыми Тогда вставь между кодом кнопок обычный пробел -   будет промежуток между кнопками при этом отступы у кнопок будут нулевыми. Расстояние мужду кнопками в таком случае можно будет регулировать количеством пробелов в коде.

Относительно имеющихся отступов при margin=0px , копайте код, либо присутствуют какие-то пробелы, пустые div, либо оказывают влияние уже имеющиеся стили - глобальные или частные, для конкретного блока.

doma · November 20, 2018

3 минуты назад, Chernetskiy сказал:

doma, сам-то понял чего хочешь? Хочу отступы, но чтобы отступы были нулевыми Тогда вставь между кодом кнопок обычный пробел -   будет промежуток между кнопками при этом отступы у кнопок будут нулевыми. Расстояние мужду кнопками в таком случае можно будет регулировать количеством пробелов в коде.

Относительно имеющихся отступов при margin=0px , копайте код, либо присутствуют какие-то пробелы, пустые div, либо оказывают влияние уже имеющиеся стили - глобальные или частные, для конкретного блока.

ладно :)) прекращаем диспут - вы все равно не понимаете о чем суть :))
я вам даже скриншоты привел выше и даже сам код со страницы - вы даже не пытались разобраться :)) я сам понял в чем проблема, (но это лично мое мнение)
вы даже не смотрите на то что на скриншотах, что применяя один и тот же стиль для кнопок для кнопок с "11" отступы есть, а для тех же стилей где значение "22" уже отступа нет.

TopRaN · November 20, 2018

21 минуту назад, Chernetskiy сказал:

Относительно имеющихся отступов при margin=0px , копайте код, либо присутствуют какие-то пробелы, пустые div, либо оказывают влияние уже имеющиеся стили - глобальные или частные, для конкретного блока.

Проще всего скриптом навешать.

TopRaN · November 20, 2018

22 минуты назад, doma сказал:

ладно :)) прекращаем диспут - вы все равно не понимаете о чем суть :))
я вам даже скриншоты привел выше и даже сам код со страницы - вы даже не пытались разобраться :)) я сам понял в чем проблема, (но это лично мое мнение)
вы даже не смотрите на то что на скриншотах, что применяя один и тот же стиль для кнопок для кнопок с "11" отступы есть, а для тех же стилей где значение "22" уже отступа нет.

Просто мы не можем понять нафига все это нужно!!! что бы кнопки сливались в одно целое - фу гадость, уровень пятиклассника ! Все должно быть минимизировано, понятно для пользователя и меньше геммороя. Не нравятся кнопки бутстрапа, напишите свои, проще и удобнее. Нужно слить в одну линию нет ни чего лучше блокового пространства с вложенным элементом.

TopRaN · November 20, 2018

В 19.11.2018 в 01:38, doma сказал:

впрочем как обычно мне все стало понятно - решения не ищется и все приходится делать самому и самому экспериментировать.

ЕСли бы это была ошибка в работе сайта, то решение как раз всегда найдется. Если вы хотите сами все переделать, вам ни кто не запрещает.

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

doma · November 20, 2018

4 минуты назад, TopRaN сказал:

ЕСли бы это была ошибка в работе сайта, то решение как раз всегда найдется. Если вы хотите сами все переделать, вам ни кто не запрещает.

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

я ни кого не желал обидеть :))) я всего лишь спросил грамотного и компетентного мнения и решения. но пришлось выяснять методом экспериментов.

вот смотрите что выявилось. предположим у кнопки бустрап btn margin=2px по факту между кнопками со всех сторон будет отступ в 2px/
если написать вот так
<table>
<tr>
<td>
<a class="btn btn-primary btn-block">кнопка</a>
</td>
</tr>
</table>
то при встраивании кнопки в ячейку таблицы, то почему то слева будет отступ в 2px а вот справа нет, поэтому дизайн немного ломается и встраивание элемента происходит не совсем корректно

вот пример

TopRaN · November 20, 2018

Если это совсем кретично, можно скриптом повесить принудительно отступы.

Оператор find(элемент).

bootstrap + шаблон

Recommended Posts

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Поделиться сообщением

Ссылка на сообщение

Поделиться на других сайтах

Создайте аккаунт или войдите для комментирования

Создать аккаунт

Войти