Can't change opacity of modal dialog

Hello all. I am trying to do something in pure CSS that I always used a ModalPopupExtender from the Ajax Control Toolkit. I have the popup opening correctly and I set the opacity in the outer div and set the z-index but it always dims the whole screen including the popup. My CSS is below. What am I missing?

.modalBackground
{
    background-color: #C0C0C0;
    opacity:0.4;
    filter:alpha(opacity=40);
    z-index:1000;
}
 
.modalPopup
{
    background: #4b6c9e;
    border: 2px solid black;
    border-radius: 5px;
   position: absolute;
    top: 0px;

Elements aligning different in Firefox and Chrome

Hello,

I am hoping somebody has the time to check out my site: http://www.doggy-daycare.dk.

I am using Wordpress as CMS. In the top right corner I have added the following widgets: Socialmedia icons, some text and two buttons. My problem is that they are aligning differently when viewing the site in Firefox than in Chrome. Any suggestions why this is?

Secondly - how can i make them align on top of each other, so that the text is positioned over the buttons and socialmedia icons?

The CSS:

element {
    padding-top: 62.5px;

make wrapper div to resize (fit) in mobile screen devices

Guys,

check here:

http://www.gv4r.com/index.php?lang=en

This is the default protostart template of joomla 3. I have tested in various mobile devices and HTML/CSS seem to work. No breaks at all.

BUT when page loads in a mobile device, it does not re-fit to its window (screen resolution).

How can i make it fit to window (resize) on mobile devices?

Address Validation Site Design

Hi this is my first time in posting at this forum, and I'm not really good at designing and css stuffs so I'm asking you guys for some suggestions below is the current look of my site and the css code. I need to have a better layout and put some color I guess.

mysite.png

css code:

#supermaindiv {
    position:static;
}
#maindiv {
    position:static;
}
#cma {
    position:relative;
    right: -200px;
}
#youentered {
    position:relative;
}
#gsays {
    position:relative;
    top:-120px;

Making my website responsive - facing problems.

HTML Code -

<!DOCTYPE html>
<html>
 <!-- Made by Yours Truly with loving support of Bootstrap 3.0 !-->
  <head>
    <title>Tushar Gupta | Web Developer & Designer</title>
 
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Bootstrap -->
    <link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
    <link href="css/animate.min.css" rel="stylesheet" media="screen">
 
 
    <link href="css/main.css" rel="stylesheet" media="screen">
     <link href="css/fontello.css" rel="stylesheet" media="screen">

Syndicate content