Mail Popup Screen

Print screen without any additional CSS

 

Mailto popup venster zonder aanvullende stijling

 

Structure with classes and id's


head
link rel=stylesheet /templates/system/css/template.css type=text/css
body.contentpane
form
div (padding:10px)
div (text-align:right) a Sluit venster img (close-x.png)
div.componentheading E-mail deze link naar een vriend/vriendin.
E-mail aan: input.inputbox
Verzender: input.inputbox
Uw e-mailadres: input.inputbox
Onderwerp: input.inputbox
button.button Verstuur button.button Annuleer

 

CSS

In the structure above you see that there is a link to a non existing stylesheet: "templates/system/css/template.css". You have to create it and save it to the proper folder in your Joomla website. Then you have to put in some CSS like the CSS below.

 

body.contentpane {
   background-image:url(../../Joomla_css/images/bg_content.jpg);
   background-position: 0 0;
   background-repeat: no-repeat;
   margin: 0;
   padding: 0;
   font-family: Verdana;
   font-size: 12px;
   line-height: 16px;
   color: #660000;
   line-height: 16px;
   color: #660000;
}

body.contentpane form { }
body.contentpane form div { }
body.contentpane form div div { }

body.contentpane form div div a,
body.contentpane form div div a:visited {
   color: #660000;
}

body.contentpane form div div a:hover {
   color:#ff0000;
}

body.contentpane form div div a img {
   display: none;
}

body.contentpane div.componentheading {
   font-family: Arial;
   font-size: 16px;
   font-weight: bold;
   color: #660000;
   line-height: 16px;
   margin: 20px 0 10px 0;
}

body.contentpane form div p {
   margin: 0;
   padding: 0;
}

body.contentpane form div p input.inputbox {
   margin-bottom: 5px;
}

body.contentpane form div p button.button { }

 

Print screen after applying CSS

 

Popup Venster Mailto gestijld

Comments (0)
Post a commment or ask a question!
Your Contact Details:
Comment:
Security
Please input the anti-spam code that you can read in the image.