Позиционирование содержимого относительно фона

Я новичок в HTML и CSS и боролся с простой проблемой. Я проектирую музыкальное пространство: http://theparadisegarage.co/, и я пытаюсь разместить основное текстовое поле, чтобы текст «исчезал» (т.е. заканчивается) за ящиком в том же месте. В действительности текстовое поле меняет местоположение в зависимости от размера окна. Я попытался установить абсолютное положение и дать ему фиксированный (px) край внизу, но он, похоже, не работает. Чтобы дать вам представление о базовом местоположении, которое я хотел бы разместить в текстовом поле, я разместил текстовое поле по отношению к верхней части окна браузера (потому что это по какой-то причине работает). Я включил relavent CSS. Я в тупик ... спасибо за любую помощь!Позиционирование содержимого относительно фона

<html> 
     <body style="background-color:transparent"> 
     <div id="container" style="background-color:transparent" > 
      <div id="logo"> 

      </div> 
      <div id="content" style="float:left" > 

      </div> 
      <div id="navbar" style="position:fixed"> 

     </div> 
     </div> 

    </body> 
    </html> 


    body{ 
     width: 100%;  
     height: 100%;  
     margin: 0;  
     padding: 0; 
    background-image:url(paradisebackground6.jpg); 
    background-repeat:no-repeat; 
    background-attachment: fixed; 

    } 


    container { 
position:relative; 
width:100%; 
height:100%; 
    } 

    content{  
     position:relative; 
    vertical-align:bottom; 
    margin-top:12.5%; 
    margin-left:190px; 
    margin-right:auto; 
    width:625px; 
    height:372px; 
    overflow:auto; 
    z-index:-40 
}

источник

2012-04-09 LukeTodd

Похоже, вы поняли это? Используйте z-index для позиционирования элементов спереди или сзади других элементов.

источник

2012-04-09 17:08:54

К сожалению, я не пытался создать передний план (ящик) и фон (ручки для записи), но когда я разместил передний план над текстом, он больше не позволял мне прокручивать. – LukeTodd

при использовании ПОЗИЦИИ в CSS, что лучше, что использование верх/низ/вправо/влево вместо краев:

#content{ 

    position:relative; 
    top:12.5%; 
    left:190px; 

    width:625px; 
    height:372px; 

}

уведомление: вы должны использовать #, прежде чем селектор CSS !!!

источник

2012-04-09 17:12:16 EmRa228

не знал, что ... спасибо за отзыв! – LukeTodd

Позиционирование содержимого относительно фона

ответ

Смежные вопросы