Mail Popup Screen
Print screen without any additional CSS

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


