Рамка для $IMAGE1$ - Форум
Страница 1 из 11
Форум » Форум веб мастеров » uCoz » Рамка для $IMAGE1$ (Рамка не обтягивает изображение)
Рамка для $IMAGE1$

aziadka
Пользователи
Сообщений 7
+
0
-
Ваши награды 0
aziadka написал: В ответ пользователя aziadka Написано 09 Марта 2013 в 22:00
Сообщение № 1
Ребятушки помогите плиз решить проблемку.
имеется вот такой код CSS.

Код
.thumb { padding: 5px 5px 5px; margin: 5px 0 0; border: 1px solid #c6c6c6;
   -moz-box-shadow: 1px 1px 6px #e1e1e1; -webkit-box-shadow: 1px 1px 6px #e1e1e1;
   -khtml-box-shadow: 1px 1px 6px #e1e1e1; box-shadow: 1px 1px 6px #e1e1e1;
   -moz-border-radius: 5px; -webkitborder-radius: 5px;
   -khtml-border-radius: 5px; border-radius: 5px; }
.thumb-bg { background: #f5f5f5; }
.thumb-river { border: 1px solid #c6c6c6; }
.thumb-left { height: 10px; background: url(/thumb-left.gif) no-repeat left center; }
.thumb-right { height: 10px; background: url(/thumb-right.gif) no-repeat right center; }
.thumb img { margin: 0px; padding: 0px; }


всё отлично работает, но есть проблемка: Рамка не обтягивает изображение



Выручайте.. smile
«Пред. тема След. тема»

BLAzER
Друзья
Сообщений 2335
+
+13383
-
Ваши награды 48
BLAzER написал: отредактировал: BLAzER - Воскресенье, 10.03.2013, 10:52 В ответ пользователя BLAzER Написано 10 Марта 2013 в 10:50
Сообщение № 2
Можно ссылку на сайт?
подпись: BLAzER

aziadka
Пользователи
Сообщений 7
+
0
-
Ваши награды 0
aziadka написал: В ответ пользователя aziadka Написано 10 Марта 2013 в 11:44
Сообщение № 3
Сайт пока отключен..

вот ещё что-бы ближе к суути



сама картинка выводится таким образом:

Код
<div class="thumb">$IMAGE1$</div>

Fatal1ti
Проверенные
Сообщений 101
+
+2216
-
Ваши награды 5
Fatal1ti написал: В ответ пользователя Fatal1ti Написано 10 Марта 2013 в 14:25
Сообщение № 4
aziadka, вторая картинка тут нам не поможет... И этот маленький код тоже
Или давай ссылку на сайт (включи его) или давай больше кода
подпись: fatal1ti.ru Fatal1ti

Вовчик
Администратор
Сообщений 8682
+
+2355
-
Ваши награды 314
Вовчик написал: В ответ пользователя Вовчик Написано 10 Марта 2013 в 14:52
Сообщение № 5
BLAzER, Fatal1ti, какой вам сайт? wacko он это сам делает, рипнуть не сможете... happy

Код

<div class="thumb">
<img src="http://webo4ka.ru/avatar/89/473800.png">
</div>

<style>
.thumb img { padding: 5px 5px 5px; margin: 5px 0 0; border: 1px solid #c6c6c6; max-width:1000px; width:auto;
   -moz-box-shadow: 1px 1px 6px #e1e1e1; -webkit-box-shadow: 1px 1px 6px #e1e1e1;  
   -khtml-box-shadow: 1px 1px 6px #e1e1e1; box-shadow: 1px 1px 6px #e1e1e1;  
   -moz-border-radius: 5px; -webkitborder-radius: 5px;  
   -khtml-border-radius: 5px; border-radius: 5px; }
</style>
подпись: Если я помог тебе, помоги и ты мне Мой WMR --> R250600748056
p.s. это лучшее выражение благодарности))
Вовчик

aziadka
Пользователи
Сообщений 7
+
0
-
Ваши награды 0
aziadka написал: В ответ пользователя aziadka Написано 10 Марта 2013 в 15:23
Сообщение № 6
Цитата (Fatal1ti)
aziadka, вторая картинка тут нам не поможет... И этот маленький код тоже
Или давай ссылку на сайт (включи его) или давай больше кода


так это и есть весь код.
это в CSS
Код
.thumb { padding: 5px 5px 5px; margin: 5px 0 0; border: 1px solid #c6c6c6;  
   -moz-box-shadow: 1px 1px 6px #e1e1e1; -webkit-box-shadow: 1px 1px 6px #e1e1e1;  
   -khtml-box-shadow: 1px 1px 6px #e1e1e1; box-shadow: 1px 1px 6px #e1e1e1;  
   -moz-border-radius: 5px; -webkitborder-radius: 5px;  
   -khtml-border-radius: 5px; border-radius: 5px; }  
  .thumb-bg { background: #f5f5f5; }  
  .thumb-river { border: 1px solid #c6c6c6; }  
  .thumb-left { height: 10px; background: url(/thumb-left.gif) no-repeat left center; }  
  .thumb-right { height: 10px; background: url(/thumb-right.gif) no-repeat right center; }  
  .thumb img { margin: 0px; padding: 0px; }


а это там где выводится изображение (например новости сайта)

Код
<div class="thumb">$IMAGE1$</div>

Добавлено (10.03.2013, 15:23)
---------------------------------------------
есть один нюанс..
с прямой ссылкой на изображение все работает

Код
<div class="thumb">  
  <img src="http://webo4ka.ru/avatar/89/473800.png">  
  </div>  

  <style>  
  .thumb img { padding: 5px 5px 5px; margin: 5px 0 0; border: 1px solid #c6c6c6; max-width:1000px; width:auto;  
    -moz-box-shadow: 1px 1px 6px #e1e1e1; -webkit-box-shadow: 1px 1px 6px #e1e1e1;   
    -khtml-box-shadow: 1px 1px 6px #e1e1e1; box-shadow: 1px 1px 6px #e1e1e1;   
    -moz-border-radius: 5px; -webkitborder-radius: 5px;   
    -khtml-border-radius: 5px; border-radius: 5px; }  
  </style>
[/color]

а вот с $IMAGE1$ рамка не обтягивает изображение

Код
<div class="thumb">  
$IMAGE1$
  </div>  

  <style>  
  .thumb img { padding: 5px 5px 5px; margin: 5px 0 0; border: 1px solid #c6c6c6; max-width:1000px; width:auto;  
    -moz-box-shadow: 1px 1px 6px #e1e1e1; -webkit-box-shadow: 1px 1px 6px #e1e1e1;   
    -khtml-box-shadow: 1px 1px 6px #e1e1e1; box-shadow: 1px 1px 6px #e1e1e1;   
    -moz-border-radius: 5px; -webkitborder-radius: 5px;   
    -khtml-border-radius: 5px; border-radius: 5px; }  
  </style>
[color=red]

Dj
Пользователи
Сообщений 12
+
+56
-
Ваши награды 2
Dj написал: В ответ пользователя Dj Написано 10 Марта 2013 в 16:28
Сообщение № 7
float:left; тебе в помощь

Fatal1ti
Проверенные
Сообщений 101
+
+2216
-
Ваши награды 5
Fatal1ti написал: В ответ пользователя Fatal1ti Написано 10 Марта 2013 в 16:32
Сообщение № 8
Вовчик, wacko кого рипнуть то??
Я просто привык через "Просмотр кода элемента" в Chrome всё делать и исправлять - так легче.
А так если на код смотреть трудновато будет...

Как вариант тут можно выравнивание сделать (но может немного диз сдвинуть):
Код
<div class="thumb">   
$IMAGE1$  
   </div>   
<style>   
   .thumb { float: left; padding: 5px 5px 5px; margin: 5px 0 0; border: 1px solid #c6c6c6;
     -moz-box-shadow: 1px 1px 6px #e1e1e1; -webkit-box-shadow: 1px 1px 6px #e1e1e1;    
     -khtml-box-shadow: 1px 1px 6px #e1e1e1; box-shadow: 1px 1px 6px #e1e1e1;    
     -moz-border-radius: 5px; -webkitborder-radius: 5px;    
     -khtml-border-radius: 5px; border-radius: 5px; }   
   </style>


В данном случае, стили задаются только для дива.
Вариант Вовчика со стилями для картинки, и я проверил там и так и так нормально всё.
В общем я запутался чёто..

Добавлено (10.03.2013, 16:32)
---------------------------------------------
Dj, Опередил меня... блин, всё я тут лишний, пойду фильм смотреть

подпись: fatal1ti.ru Fatal1ti

Вовчик
Администратор
Сообщений 8682
+
+2355
-
Ваши награды 314
Вовчик написал: В ответ пользователя Вовчик Написано 10 Марта 2013 в 16:34
Сообщение № 9
Цитата (Fatal1ti)
в Chrome

а что в хроме есть возможность сразу просматривать измененный код? я думал только в опере такая фигня))
подпись: Если я помог тебе, помоги и ты мне Мой WMR --> R250600748056
p.s. это лучшее выражение благодарности))
Вовчик

BLAzER
Друзья
Сообщений 2335
+
+13383
-
Ваши награды 48
BLAzER написал: В ответ пользователя BLAzER Написано 10 Марта 2013 в 16:44
Сообщение № 10
Цитата (Fatal1ti)
Я просто привык через "Просмотр кода элемента" в Chrome всё делать и исправлять - так легче.

и быстрее
подпись: BLAzER

aziadka
Пользователи
Сообщений 7
+
0
-
Ваши награды 0
aziadka написал: В ответ пользователя aziadka Написано 10 Марта 2013 в 16:48
Сообщение № 11
Fatal1ti, Спасибо дорогой! Всё работает! biggrin
Ну и всем не равнодушным Спасибо! biggrin
Форум » Форум веб мастеров » uCoz » Рамка для $IMAGE1$ (Рамка не обтягивает изображение)
Страница 1 из 11
Поиск:
Топ пользователей: