2013-10-28 4 views
0

привет, я делаю свой проект в mvc4. на моей странице Layout у меня есть прозрачный div (#wrapper), и у меня есть много непрозрачных div. Для этого я использую следующий код css и html.Позиция непрозрачного div на прозрачном выпуске div

<div id="wrapper"> 
<div id="header"> 
    <div id="logo"></div> 
    <div id="navigation"></div> 
</div> 
<div id="content"> 
    @RenderBody() 
</div> 
</div> 

CSS

#wrapper { 
position:relative;} 

#wrapper:before { 
margin-left:12%; 
width:76%; 
background-color:#6c88b6; 
content:''; 
min-height:400px; 
height:auto; 
overflow:hidden; 
position:absolute; 
opacity:.5;} 

#header { 
position:relative; 
} 

#logo { 
margin-left:3%; 
margin-top:20px; 
margin-bottom:20px; 
display:inline-block; 
height:70px; 
width:300px; 
background:url(../Shared/Images/logo.png) no-repeat center left ; 
} 

#navigation { 
margin-left:1%; 
width:98%; 
background-color:#fff; 
height:50px; 
} 

#content { 
    position:relative; 
} 

моя проблема заключается в том, что внутри DIV-й в обертке (не прозрачный DIV в) положение не является правильным. Они не отображаются внутри обертки div. Как я могу исправить их положение.

+0

непонятно, какой div является прозрачным и непрозрачным ..... –

+0

#wrapper является прозрачным. все остальные непрозрачны – neel

+0

Что вы пытаетесь достичь с помощью: перед псевдоэлементом? – davidpauljunior

ответ

0

Вот что я нашел работы. Используйте div для установки высоты, ширины, отступов и других параметров форматирования. Затем элемент класса устанавливает любые цвета, прозрачность и другую косметику. Чтобы классы прозрачного использование

#class { 
background-color:rgba(108.136.182.0.5) 
} 

, что код должен также работать, если вы просто поместите его в «#wrapper» сОн а. первые три десятичных знака - это цвет, а последний - непрозрачность объекта. Кроме того, «1,0» или 1 равно 100%, поэтому я использовал 0,5

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