source: tapas/web/resources/css/blueprint-css/blueprint/src/forms.css @ 376

Last change on this file since 376 was 376, checked in by rboipsl, 12 years ago

Creation projet tapas

File size: 2.5 KB
Line 
1/* --------------------------------------------------------------
2
3   forms.css
4   * Sets up some default styling for forms
5   * Gives you classes to enhance your forms
6
7   Usage:
8   * For text fields, use class .title or .text
9   * For inline forms, use .inline (even when using columns)
10
11-------------------------------------------------------------- */
12
13/*
14        A special hack is included for IE8 since it does not apply padding
15        correctly on fieldsets
16 */ 
17label       { font-weight: bold; }
18fieldset    { padding:0 1.4em 1.4em 1.4em; margin: 0 0 1.5em 0; border: 1px solid #ccc; }
19legend      { font-weight: bold; font-size:1.2em; margin-top:-0.2em; margin-bottom:1em; }
20
21fieldset, #IE8#HACK { padding-top:1.4em; } 
22legend, #IE8#HACK { margin-top:0; margin-bottom:0; }
23
24/* Form fields
25-------------------------------------------------------------- */
26
27/*
28  Attribute selectors are used to differentiate the different types
29  of input elements, but to support old browsers, you will have to
30  add classes for each one. ".title" simply creates a large text 
31  field, this is purely for looks.
32 */
33input[type=text], input[type=password],
34input.text, input.title,
35textarea {
36  background-color:#fff;
37  border:1px solid #bbb;
38}
39input[type=text]:focus, input[type=password]:focus,
40input.text:focus, input.title:focus,
41textarea:focus {
42  border-color:#666;
43}
44select { background-color:#fff; border-width:1px; border-style:solid; }
45
46input[type=text], input[type=password],
47input.text, input.title,
48textarea, select {
49  margin:0.5em 0;
50}
51
52input.text,
53input.title   { width: 300px; padding:5px; }
54input.title   { font-size:1.5em; }
55textarea      { width: 390px; height: 250px; padding:5px; }
56
57/*
58  This is to be used on forms where a variety of elements are
59  placed side-by-side. Use the p tag to denote a line.
60 */
61form.inline { line-height:3; }
62form.inline p { margin-bottom:0; }
63
64
65/* Success, info, notice and error/alert boxes
66-------------------------------------------------------------- */
67
68.error,
69.alert, 
70.notice,
71.success, 
72.info                   { padding: 0.8em; margin-bottom: 1em; border: 2px solid #ddd; }
73
74.error, .alert { background: #fbe3e4; color: #8a1f11; border-color: #fbc2c4; }
75.notice     { background: #fff6bf; color: #514721; border-color: #ffd324; }
76.success    { background: #e6efc2; color: #264409; border-color: #c6d880; }
77.info                   { background: #d5edf8; color: #205791; border-color: #92cae4; }
78.error a, .alert a { color: #8a1f11; }
79.notice a   { color: #514721; }
80.success a  { color: #264409; }
81.info a                 { color: #205791; }
Note: See TracBrowser for help on using the repository browser.