Что надо сделать, чтобы при сжатия браузера картинки на сайте не разъезжались ?

Discussion in 'CSS, HTML, Web 2.0, верстка по web-стандартам' started by pik, Jul 18, 2010.

  1. Offline

    pik Недавно здесь

    Joined:
    Nov 29, 2009
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    Что надо сделать, чтобы при сжатия браузера картинки на сайте не разъезжались ? Спасибо....верстка на div.
     
    pik, Jul 18, 2010
    #1

  2. Ads Master

     
  3. woojin
    Offline

    woojin Местный Staff Member => Cпециалист <=

    Joined:
    May 31, 2009
    Messages:
    3,204
    Likes Received:
    334
    Gender:
    Male
    скорее всего POSITION: ABSOLUT в CSS
     
    woojin, Jul 19, 2010
    #2
  4. Offline

    pik Недавно здесь

    Joined:
    Nov 29, 2009
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    нет не помогает, кстате у сайта joom.ru такая же проблема.....
     
    pik, Jul 19, 2010
    #3
  5. woojin
    Offline

    woojin Местный Staff Member => Cпециалист <=

    Joined:
    May 31, 2009
    Messages:
    3,204
    Likes Received:
    334
    Gender:
    Male
    тогда float:left;
    или задай DIV'у железные размеры
     
    woojin, Jul 19, 2010
    #4
  6. Offline

    pik Недавно здесь

    Joined:
    Nov 29, 2009
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    когда сжимаю, сама картинка сжимается.....хотя она должна полностью быть залита по всем осям, при сжатии браузера опять же сжимается по оси х.... сами же блоки не сжимаються...

    вот структура:
    Код (CODE):
    1. <div id="content">
    2.   <div id="content-wr">
    3.             <div class="content-art"><jdoc:include type="component" /></div>
    4.       <div class="col">
    5.          <div class="right1"><?php if($this->countModules('right1')) : ?>
    6.             <jdoc:include type="modules" name="right1" style="xhtml" />
    7.             <?php endif; ?>
    8.             </div>
    9.          <div class="right2"><?php if($this->countModules('right2')) : ?>
    10.         <jdoc:include type="modules" name="right2" style="xhtml" />
    11.         <?php endif; ?>
    12.           </div><div class="clear"></div>
    13.           </div>
    14.   </div>
    15. </div>


    css:

    Код (CODE):
    1. #content
    2. {
    3.     width:100%;
    4.     background: url(../images/content_body.gif) !important;
    5.     background-repeat: repeat;
    6.     position:relative;
    7.     }
    8. div#content-wr {
    9.     width:960px;
    10.     margin-left:150px;
    11.     background-image: none;
    12.    
    13.         }
    14. .content-art{
    15.     float:left;
    16.     width:510px;
    17.     position:relative;
    18.     padding:10px 5px 10px 5px;
    19.     }
    20.  
    21. .col {
    22.    
    23.     margin-left: 520px;
    24.     width: 440px;
    25.    
    26.     }
    27.    
    28. .right1{
    29.    
    30.     float:left;
    31.     width: 210px;
    32.     padding:10px 5px 10px 5px;
    33.            
    34.    
    35. }  
    36.    
    37. .right2{
    38.     float:right;
    39.     width: 210px;
    40.     padding:10px 5px 10px 5px;
    41.    
    42. }
     
    Last edited: Jul 19, 2010
    pik, Jul 19, 2010
    #5
  7. woojin
    Offline

    woojin Местный Staff Member => Cпециалист <=

    Joined:
    May 31, 2009
    Messages:
    3,204
    Likes Received:
    334
    Gender:
    Male
    адрес дай чтобы ручками потрогать

    к томуже у тебя шаблон сделан в АРТИСТЕРЕ, а там на сколько я знаю все размеры не резиновые, и если ты самостоятельно сделал там резину, то шаблон может вести себя как только ему заблагорассудится
     
    woojin, Jul 19, 2010
    #6
  8. Offline

    pik Недавно здесь

    Joined:
    Nov 29, 2009
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    сайт на локалке, шаблон руками делался)) тогда такой вопрос, вот как правильно записать
    например:

    Код (CODE):
    1. div#right .moduletable h1,h2,h3,h4,h5
    2. {
    3. color:#613208;
    4. }


    во общем чтобы это правило работало тока для одного дива ?
     
    Last edited: Jul 19, 2010
    pik, Jul 19, 2010
    #7
  9. woojin
    Offline

    woojin Местный Staff Member => Cпециалист <=

    Joined:
    May 31, 2009
    Messages:
    3,204
    Likes Received:
    334
    Gender:
    Male
    для начала убрать пробел "div#right .moduletable" а в остальном всё правильно и к ".moduletable" можно дописать какой то определенный суффикс в модуле, и по нему просто написать класс

    пример:
    стандартно выглядит так: ".moduletable"
    с дополнительным суффиксом ".moduletable-privet"
    во втором случае должно быть так написано в CSS
    а в админке модуля просто добавлено "-privet"

    по моему доходчиво
     
    woojin, Jul 19, 2010
    #8
    pik likes this.
  10. Offline

    pik Недавно здесь

    Joined:
    Nov 29, 2009
    Messages:
    12
    Likes Received:
    0
    Gender:
    Male
    Спасибо....
    Работает тока когда так
    Код (CODE):
    1. div#right .moduletable h1{color:#fff;}

    ,а все сразу не хочет
    Код (CODE):
    1. div#right .moduletable h1, h2, h3, h4, h5{color:#fff;}


    еще столкнулся с проблемой, у меня получается у каждого блока заданная ширина, и когда модуль не использует данный блок в нем пустое место, как сделать, чтобы когда модуль отключен, ширина блока соседнего автоматически растягивалась на свободное место ?
     
    pik, Jul 19, 2010
    #9
  11. woojin
    Offline

    woojin Местный Staff Member => Cпециалист <=

    Joined:
    May 31, 2009
    Messages:
    3,204
    Likes Received:
    334
    Gender:
    Male
    сделай так чтобы перед выводом блока опрашивалось количество выводимых в нём модулей, если количество равно нулю, тогда блок не выводи функция moscountmodules или что то подобное
     
    woojin, Jul 20, 2010
    #10
  12. Jkr
    Offline

    Jkr Группа поддержки

    Joined:
    Aug 4, 2006
    Messages:
    464
    Likes Received:
    27
    Gender:
    Male
    У вас стили отдельно для div#right .moduletable h1 (h1 вложенный в блок с классом moduletable, который в свою очередь, находится внутри div с id=right), для h2 (любого), h3 (любого) и т.д. Чтобы настроить стиль для каждого заголовка, вложенного moduletable внутри #right, правильно писать:
    Код (CODE):
    1. div#right .moduletable h1,
    2. div#right .moduletable h2,
    3. div#right .moduletable h3,
    4. div#right .moduletable h4,
    5. div#right .moduletable h5 {color:#fff;}

    (перенос строки оставлен, чтобы пост на форуме не разъезжался по горизонтали; в оригинале можно писать в 1 строку)
    Учите матчасть.
     
    Jkr, Jul 20, 2010
    #11
< border-radius.htc и Joomla 1.18 | Некорректное отображение каталога товара в IE6 >

Share This Page

Loading...