Laat elemente fixed staan op een achtergrond afbeelding

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Francoi gckx

Francoi gckx

15/10/2014 07:19:55
Quote Anchor link
Afbeelding

Elke keer als ik inzoom gaan de elementen naar rechts verschuiven:

css:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
#FWTableContainer635598069 {
/* The master div to make sure that our popup menus get aligned correctly.  Be careful when playing with this one. */
    position: absolute;
    top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  background-repeat: no-repeat;
  background-position: top center;
  background-color: #211E23;
    background-image: url('../img/Layer.jpg');
    height: 469px;
    
background-size: 1990px 469px;
    
   .rgba(@bluebox-text-option, 0.5); */

  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transform: translateZ(0);
    .visibility();*/

}
.middle_row
    {
        margin: 0 auto;
        width: 400px;
    }
.left_row
    {
     float: left;
     width: 200px;
     margin-top: -160px;
     margin-left: 96px;
    }
.right_row
    {
     float: right;
     width: 200px;
     margin-right: 115px;
     margin-top: -165px;
    }
#download_btn
    {
     margin-top: -15px;
    }
#FWTableContainer635598069 #table {
    
    width: 1990px;
    position:fixed;
    height: 469px;
    margin: 0 auto;
}
#main_button
    {
        margin: 0 auto;
        width: 508px;
        height: 235px;
    }


html
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
<div id="FWTableContainer635598069">
        

 <div id="table">

 <div class="middle_row">
   <div id="main_button"><a href="javascript:;" onMouseOut="MM_menuStartTimeout(1000);" onMouseOver="MM_menuShowMenu('MMMenuContainer1014185857_0', 'MMMenu1014185857_0',0,235,'header2ro1_r1_c4');"><img name="header2ro1_r1_c4" src="views/assets/img/header2ro1_r1_c4.jpg" width="508" height="235" alt=""></a></div>
  </div>
   <div class="left_row">
   <div id="download_btn"><a href="javascript:;" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('header2ro1_r2_c2','','views/assets/img/download.png',1);"><img name="header2ro1_r2_c2" src="views/assets/img/header2ro1_r2_c2.jpg" width="198" height="60" alt=""></a></div>
     <div id="install_btn"><a href="javascript:;" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('header2ro1_r4_c2','','header2ro1_r3_c1.gif','header2ro1_r4_c2','','views/assets/img/install.png',1);"><img name="header2ro1_r4_c2" src="views/assets/img/header2ro1_r4_c2.jpg" width="198" height="47" alt=""></a></div>
     <div id="uploadnow_btn"><a href="javascript:;" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('header2ro1_r6_c2','','views/assets/img/uploadnow.png',1);"><img name="header2ro1_r6_c2" src="views/assets/img/header2ro1_r6_c2.jpg" width="198" height="54" alt=""></a></div>
    </div>
     <div class="right_row">
   <div id="takeatour_btn"><a href="javascript:;" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('header2ro1_r2_c6','','views/assets/img/takeatour.png',1);"><img name="header2ro1_r2_c6" src="views/assets/img/header2ro1_r2_c6.jpg" width="191" height="60" alt=""></a></div>
  
    <div id="sendmess_btn"><a href="javascript:;" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('header2ro1_r4_c6','','views/assets/img/sendmess.png',1);"><img name="header2ro1_r4_c6" src="views/assets/img/header2ro1_r4_c6.jpg" width="191" height="47" alt=""></a></div>
   <div id="instantaccess_btn"><a href="javascript:;" onMouseOut="MM_swapImgRestore();" onMouseOver="MM_swapImage('header2ro1_r6_c6','','views/assets/img/instantaccess.png',1);"><img name="header2ro1_r6_c6" src="views/assets/img/header2ro1_r6_c6.jpg" width="191" height="54" alt=""></a></div>
   </div>
 
Er zijn nog geen reacties op dit bericht.



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.