google_clone/google_clone.css at master · dwiesenberg/google_clone · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
/*  HTML and CSS to clone Google page project */

/* Menu links in header -- to be completed */

/* Google logo */

img {
  width: 272px;
  /* height calculated by default to prevent distorted image */
  margin-top: 192px;
  horizontal-align: center;
}

/* Search bar */

input {
  width: 564px;
  height: 32px;
  border: 6px solid #949599;
  font: 14px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0;
}

/* microphone image within Search Bar at extreme right. Call image name "micrphone.jpg". Fopr speech input. How put in? (If speech input part is too complicated, then how put in image only?) This question applies to both HTML and CSS. */

/* Google search ... I'm Feeling Lucky */

a {
  display:inline-block;
  font: 14px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 0, 6, 386, 180;
  border: 6px solid #949599;
}

.google_search {
  margin: 0, 6, 386, 180;
  float: left;
  width: 40%;
}

.feeling_lucky {
  margin: 0, 180, 386, 6;
  float: right;
  width: 60%;
}

/* Footer bar */

footer {
  width: 100%;
  height: 32px;
  border: 6 px solid #949599;
  font: 14px/1.4 "Helvetica Neue", Helvetica, Arial, sans-serif;
  margin: 20px
  background: #ececec;
}

a {
  clear:both;
  float:left;
}

.advertising {
  width: 96px;
  margin: 0px 24px;
}

.business {
width: 96px;
  margin: 0px 24px;
}

.about {
  width: 96px;
  margin: 0px 24px;
}

.privacy_and_terms {
  width: 192px;
  margin: 384px 24px;
}

.settings {
  width: 96px;
  margin: 0px 0px;
}