Страница 1 из 11
Модератор форума: webanet 
Сообщество uCoz » Архивариус » Решённые вопросы » Изображение выходит за рамки форума
Изображение выходит за рамки форума
Дарг_Гм
Сообщений: 15
Репутация: 4

Сообщение # 1 | 22:40:52
Изображение, которое добавлено с помощью BB кода с стороннего хостинга, выходит за рамки форума.

Пример:
Код
[img]http://s41.radikal.ru/i093/1409/31/52015b015e3a.jpg


Менял подобные коды:

Код
width: auto;


На

Код
max-width: 650px;


Но все безрезультатно, наверное не там меня)

Ссылка на сайт: ntd.ucoz.ru

Вот код с CSS:

Код
/*forum*/
.forumContent {
  font-size: .929em;
}
.gTable {
  background: #fff;
}
.gTable td.gTableTop {
  line-height: 2.5;
  background: #C0C0C0;
  color: #fff;
  text-transform: uppercase;
  padding: 0 10px;
}
.gTableTop a {
  color: #fff;
}
.gTable > tbody > tr > td {
  padding: 3px 9px;
}
.gTable td.gTableSubTop {
  background: #C0C0C0;
  color: #fff;
  font-size: 0.929em;
}
.gTableSubTop a {
  color: #fff;
}
.gTableTop,
.gTableSubTop,
.forumNameTd,
.forumThreadTd,
.forumPosrTd,
.forumLastPostTd,
.threadNametd,
.threadPostTd,
.threadAuthTd,
.threadViewTd,
.threadLastPostTd,
td.threadsDetails,
td.forumOnlineBar {
  padding: 3px 10px;
}
#frM6 td,
#frM14 td,
#frM50 td,
#frM56 td,
#frM59 td {
  padding: 3px 10px;
}
#frM25 td,
#frM28 td {
  padding: 0 10px;
}
.postBottom table td {
  border: 0;
}
.postTable td {
  padding: 3px 10px;
}
.postTdInfo {
  text-align: center;
}
.postSeparator {
  display: none;
}
.posttdMessage {
  text-align: justify;
}
.postPreview {
  width: auto!important;
}
.threadPostTd,
.threadViewTd,
.threadAuthTd,
.forumThreadTd,
.forumPostTd {
  text-align: center !important;
}
a.postUser {
  font-weight: bold;
}
.forumDescr,
.threadDescr {
  font-size: 0.714em;
}
td.pollQuestion,
.pollResults td,
td.pollResults,
td.pollTotal,
td.pollAnswer,
td.pollButtons,
.smiles td {
  border: 0;
}
td.pagesInfo,
td.switch,
td.switchActive {
  background: #fff;
  border: 1px solid #dcdbe0;
  padding-left: 5px;
  padding-right: 5px;
}
td.switch,
td.switchActive {
  background: #C0C0C0;
  color: #fff;
}
td.switch a {
  color: #fff;
}
.switchActive {
  font-weight: bold;
}
/*-----------------------*/
/*Sidebar
-------------------------*/
.b-sidebar {
  clear: left;
  width: 280px;
  margin: 45px 0 0 0;
}
.block {
  padding: 0 20px;
  margin: 10px 0;
  border-bottom: 1px dotted #bbb;
}
.block:last-child {
  border-bottom: 0;
}
.blocktitle {
  font-size: 1.143em;
  line-height: 1.5;
  font-weight: bold;
  text-align: center;
}
.blockcontent {
  margin: 15px 0 20px;
  display: table;
  width: 100%;
}
.calTable {
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
}
.calTable td {
  padding-top: 5px;
  padding-bottom: 5px;
}
.calWday,
.calWdaySe,
.calWdaySu {
  background: #e6e6e6;
}
.calMdayA,
.calMdayIsA {
  background: #e6e6e6;
}
/*-----------------------*/
/*Footer
-------------------------*/
footer {
  padding: 20px 0;
}
footer .t-container {
  text-align: right;
}
footer img {
  vertical-align: middle;
}
/*-----------------------*/
/*Buttons
-----------------------*/
input[type=button],
input[type=submit],
input[type=reset],
button,
.button {
  display: inline-block;
  vertical-align: middle;
  padding: 5px 12px;
  white-space: nowrap;
  text-align: center;
  text-transform: uppercase;
  height: 30px;
  color: #fff;
  border: none;
  cursor: pointer;
  background-color: #C0C0C0;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: background-color 0.1s 0s ease-out;
  transition: background-color 0.1s 0s ease-out;
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  box-shadow: inset 0 -3px rgba(0, 0, 0, 0.09);
  /*--FOR-IE--*/

  *display: inline;
  overflow: visible;
  zoom: 1;
}
input[type=button]::-moz-focus-inner,
input[type=submit]::-moz-focus-inner,
input[type=reset]::-moz-focus-inner,
button::-moz-focus-inner,
.button::-moz-focus-inner {
  border: 0;
  padding: 0;
}
input[type=button]:hover,
input[type=submit]:hover,
input[type=reset]:hover,
button:hover,
.button:hover {
  background-color: #1E90FF;
}
input[type=button]:active,
input[type=submit]:active,
input[type=reset]:active,
button:active,
.button:active {
  background-color: #1E90FF;
}
input[type=button]:disabled,
input[type=submit]:disabled,
input[type=reset]:disabled,
button:disabled,
.button:disabled {
  background: #828689 !important;
  box-shadow: none !important;
  cursor: default;
}
#iplus input {
  width: auto !important;
}
.fileinput .fakefile input[type=button]{
  padding: 0;
}
input.fastNav {
  padding-left: 5px;
  padding-right: 5px;
}
#mchatBtn {
  padding: 0;
}
.codeButtons {
  height: 25px !important;
  width: auto !important;
  padding: 5px !important;
}
select.codeButtons {
  padding: 0 !important;
}
.allUsersBtn,
.uSearchFlSbm {
  width: auto !important;
}
#iplus {
  width: auto !important;
}
/*--ubutton-fix--*/
.myBtnLeft img,
.myBtnRight img,
.myBtnLeftA img,
.myBtnRightA img,
.myBtnRight + td input,
.myBtnRightA + td input {
  display: block;
}
.myBtnCenter,
.myBtnCenterA {
  line-height: 19px !important;
}
.myBtnCont {
  height: 19px;
  padding-bottom: 0 !important;
}
/*-----------------------*/
/*Inputs
-----------------------*/
input[type=text],
input[type=password],
textarea {
  display: inline-block;
  vertical-align: middle;
  padding: 5px 10px;
  font-size: 0.929em;
  background-color: #fff;
  border: 1px solid #e1e1e1;
  outline: none;
  box-shadow: inset 0 2px rgba(0, 0, 0, 0.06);
  -ms-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
input[type=text]:focus,
input[type=password]:focus,
textarea:focus {
  border-color: #2a72cc;
}
textarea {
  height: auto;
  min-height: 100px;
  overflow: auto;
  resize: none;
}
.commFl, .prosFl, .consFl {width: 100%;}
input[type=checkbox],
input[type=radio] {
  vertical-align: middle;
}
[id^=iCode] input[type=text] {
  width: auto !important;
  padding-left: 0;
  padding-right: 0;
  text-align: center;
}
/*-----------------------*/
/*Popup
-------------------------*/
.popup {
  margin: 10px;
  background: #fff;
}
.popuptitle {
  padding: 10px 20px;
  background: #C0C0C0;
  color: #fff;
}
.popupbody {
  padding: 10px 20px;
}
/*-----------------------*/
/*RESPONSIVE
-------------------------*/
@media only screen and (max-width: 1023px) {
  .t-container {
  width: auto;
  margin-left: 18px;
  margin-right: 18px;
  }
  .b-usermenu {
  display: none;
  }
  .b-main {
  margin-top: 18px;
  margin-bottom: 18px;
  }
  .b-logo {
  float: none;
  width: auto;
  padding-bottom: 0;
  }
  .b-maincontent {
  float: none;
  width: auto;
  }
  img.site-img {
  width: 100%;
  }
  .mainpage-header {
  padding-top: 20px;
  }
  .b-sidebar {
  width: auto;
  margin-top: 18px;
  }
  footer .t-container {
  text-align: center;
  }
  #top nav {
  font-size: .929em;
  }
  #top .uMenuRoot ul {
  width: auto;
  overflow: visible;
  }
  #top .uMenuRoot ul ul {
  display: block;
  position: static;
  padding-left: 0;
  background: none;
  }
  #top .uMenuRoot ul ul a {
  padding-left: 55px;
  }
  #top .uMenuRoot ul ul ul a {
  padding-left: 90px;
  }
  #top .uMenuRoot ul a:hover {
  background: #2a72cc;
  }
  #top .uMenuRoot li:hover ul {
  visibility: visible;
  opacity: 1;
  }
  #top .uMenuRoot li > span {
  line-height: 3.538em;
  }
  #top .uMenuRoot li li.has-submenu a:after,
  #top .uMenuRoot li li.has-submenu span:after {
  display: inline;
  content: '';
  position: static;
  }
  #top .uMenuRoot a {
  line-height: 3.538em;
  }
  .show-search {
  display: block;
  }
  .show-search-min {
  display: none;
  }
  .b-search.b-search-min {
  width: 0;
  }
  .commFl {
  width: 100%;
  }
}
@media only screen and (max-width: 768px) {
  .show-menu {
  display: block;
  }
  #top nav {
  display: none;
  margin-right: 0;
  padding-bottom: 4px;
  background: #2a72cc;
  box-shadow: inset 0 -4px rgba(0, 0, 0, 0.09);
  visibility: hidden;
  opacity: 0;
  }
  #top nav.nav-opened {
  display: block;
  visibility: visible;
  opacity: 1;
  }
  #top .uMenuRoot {
  white-space: nowrap;
  }
  #top .uMenuRoot li {
  display: block;
  float: none;
  }
  #top .uMenuRoot li.has-submenu a:after,
  #top .uMenuRoot li.has-submenu span:after {
  display: inline;
  content: '';
  position: static;
  }
  #top .uMenuRoot li:hover a {
  box-shadow: none;
  }
  #top .uMenuRoot li > span {
  line-height: 2.5;
  color: #fff;
  padding: 0 20px !important;
  }
  #top .uMenuRoot a {
  line-height: 2.5;
  color: #fff;
  padding: 0 20px !important;
  }
  #top .uMenuRoot a:hover,
  #top .uMenuRoot a.uMenuItemA {
  background: #8f2755 !important;
  box-shadow: none;
  }
  #top .uMenuRoot ul {
  display: block;
  position: static;
  padding-left: 0 !important;
  background: none;
  visibility: visible;
  opacity: 1;
  }
  #top .uMenuRoot ul a {
  padding-left: 35px !important;
  }
  #top .uMenuRoot ul ul a {
  padding-left: 70px !important;
  }
}
@media only screen and (max-width: 600px) {
  .b-maincontent .queryField {
  width: 100px !important;
  }
  #uNetRegF > table > tbody > tr > td {
  display: block;
  }
  #uEntriesList {
  text-align: center;
  }
  #uEntriesList > li {
  width: auto !important;
  padding: 5px;
  }
  table.catalog td {
  display: block;
  clear: left;
  }

Добавлено (07 Сен 2014, 22:40:52)
---------------------------------------------
Буду очень благодарен, если подскажите, что изменить, чтобы изображения корректно изображались на форуме

Yuri_G
Модератор форума
Сообщений: 4195
Репутация: 899

Сообщение # 2 | 23:03:39
Дарг_Гм, Перейти в панель управления - Главная - Дизайн - Управление - дизайном(CSS), далее в самый низ таблицы стилей добавить:
Код
.posttdMessage img {
  max-width:700px;
}
Сохранить.

Помощь посредством ЛС не оказываю! Спрашивайте на UВопросы
Дарг_Гм
Сообщений: 15
Репутация: 4

Сообщение # 3 | 23:21:26
Ucoz_fan, Не помогло
Yuri_G
Модератор форума
Сообщений: 4195
Репутация: 899

Сообщение # 4 | 23:25:44
Дарг_Гм, удалите там где вы добавили и добавьте сразу после строки номер 749 - http://i.imgur.com/BXpu8CU.png
вы добавили лишнюю точку перед имг .posttdMessage .img там точки не должно быть.
Теперь все верно.

Помощь посредством ЛС не оказываю! Спрашивайте на UВопросы
Дарг_Гм
Сообщений: 15
Репутация: 4

Сообщение # 5 | 23:32:10
Ucoz_fan, Пробел забыл и выше перенес, где коды:

Код
.posttdMessage {
  text-align: justify;
}
.posttdMessage img {  
max-width: 700px;
}     
.postPreview {
  width: auto!important;
}


Теперь все работает как нужно.
Спасибо большое!)
Сообщение отредактировал Дарг_Гм - Воскресенье, 07 Сен 2014, 23:33:48
Сообщество uCoz » Архивариус » Решённые вопросы » Изображение выходит за рамки форума
Страница 1 из 11
Поиск: