Hi all,
I'm having trouble with inputfields and links not being accessible because of an overlying layer.
I'm using this page which has a centered width of 780px and use a layer to place a menu at the right side of this page.
In my stylesheet I defined this as follows:
.menu780 {
width: 780px;
max-width: 780px;
margin-right:auto;
margin-left:auto;
margin-top:0px;
margin-bottom:0px;
border: 1px solid #000;
}
This layer lies over the page (using a DIV) and in this layer I place the menu (using another DIV) using:
.menu {
padding: 0px;
margin: 220px 10px 0px auto;
width:160px;
background-image:url(../images/tabelachtergrond.jpg);
background-position:top;
background-repeat:repeat-y;
border: 0px solid #000;
}
Now, the problem is, that underneath the ".menu780" which is transparant, a form is displayed and some links. The links only work in IE, not in Mozilla or Opera. The inputfield works, but is only accessible by TAB'ing to it; I can't click on it, nor can I select the text of the part of the page the layer spans over.
Does anybody know a solution to this problem? Your help will be very much appreciated.
With kind regards,
T.Maybe you should rethink the design using side-by-side divs for the menu and the form.Hi, I thought of that. I rather try some other options before redesigning. I'm not sure if I can achieve the same layout I desire, side-by-side doesn't seem to be an option at the moment.
But thanks anyway, when it should come to redesigning, which I hope is not necessary, I'll try your suggestion.
T.
I'm having trouble with inputfields and links not being accessible because of an overlying layer.
I'm using this page which has a centered width of 780px and use a layer to place a menu at the right side of this page.
In my stylesheet I defined this as follows:
.menu780 {
width: 780px;
max-width: 780px;
margin-right:auto;
margin-left:auto;
margin-top:0px;
margin-bottom:0px;
border: 1px solid #000;
}
This layer lies over the page (using a DIV) and in this layer I place the menu (using another DIV) using:
.menu {
padding: 0px;
margin: 220px 10px 0px auto;
width:160px;
background-image:url(../images/tabelachtergrond.jpg);
background-position:top;
background-repeat:repeat-y;
border: 0px solid #000;
}
Now, the problem is, that underneath the ".menu780" which is transparant, a form is displayed and some links. The links only work in IE, not in Mozilla or Opera. The inputfield works, but is only accessible by TAB'ing to it; I can't click on it, nor can I select the text of the part of the page the layer spans over.
Does anybody know a solution to this problem? Your help will be very much appreciated.
With kind regards,
T.Maybe you should rethink the design using side-by-side divs for the menu and the form.Hi, I thought of that. I rather try some other options before redesigning. I'm not sure if I can achieve the same layout I desire, side-by-side doesn't seem to be an option at the moment.
But thanks anyway, when it should come to redesigning, which I hope is not necessary, I'll try your suggestion.
T.