Ajax Loader
×

Untitled

HTML 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
1
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN">
2
<html>
3
 <head>
4
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
5
  </head>
6
 <body>
7
  <div class="bottom_menu">
8
    <div class="about">
9
      <p>About Us</p>
10
      <ul>
11
        <li>
12
          <a href="#">Our Company</a>
13
        </li>
14
        <li>
15
          <a href="#">Our Blog</a>
16
        </li>
17
        <li>
18
          <a href="#">Submit a Site</a>
19
        </li>
20
        <li>
21
          <a href="#">Contact Us</a>
22
        </li>
23
        <li>
24
          <a href="#">Help &amp; Terms</a>
25
        </li>
26
        <li>
27
          <a href="#">Read Our FAQ</a>
28
        </li>
29
      </ul>
30
    </div>
31
    <div class="popular">
32
      <p>Popular Topics</p>
33
      <ul>
34
        <li>
35
          <a href="#">Trends &amp; Technology <span>(30)</span></a>
36
        </li>
37
        <li>
38
          <a href="#">Design Companies <span>(2699)</span></a>
39
        </li>
40
        <li>
41
          <a href="#">Design Freelancers <span>(23)</span></a>
42
        </li>
43
        <li>
44
          <a href="#">Web Portfolios <span>(16)</span></a>
45
        </li>
46
        <li>
47
          <a href="#">Web Development <span>(23)</span></a>
48
        </li>
49
        <li>
50
          <a href="#">General Icons <span>(34)</span></a>
51
        </li>
52
      </ul>
53
    </div>
54
    <div class="follow">
55
      <p>Follow Us Here</p>
56
      <table>
57
        <tr>
58
          <td>
59
            <a>
60
              <img src="images/soc_1.jpg" alt="soc">
61
            </a>
62
          </td>
63
          <td>
64
            <a>
65
              <img src="images/soc_2.jpg" alt="soc">
66
            </a>
67
          </td>
68
          <td>
69
            <a>
70
              <img src="images/soc_3.jpg" alt="soc">
71
            </a>
72
          </td>
73
          <td>
74
            <a>
75
              <img src="images/soc_4.jpg" alt="soc">
76
            </a>
77
          </td>
78
          <td>
79
            <a>
80
              <img src="images/soc_5.jpg" alt="soc">
81
            </a>
82
          </td>
83
        </tr>
84
        <tr>
85
          <td>
86
            <a>
87
              <img src="images/soc_6.jpg" alt="soc">
88
            </a>
89
          </td>
90
          <td>
91
            <a>
92
              <img src="images/soc_7.jpg" alt="soc">
93
            </a>
94
          </td>
95
          <td>
96
            <a>
97
              <img src="images/soc_8.jpg" alt="soc">
98
            </a>
99
          </td>
100
          <td>
101
            <a>
102
              <img src="images/soc_9.jpg" alt="soc">
103
            </a>
104
          </td>
105
          <td>
106
            <a>
107
              <img src="images/soc_10.jpg" alt="soc">
108
            </a>
109
          </td>
110
        </tr>
111
        <tr>
112
          <td>
113
            <a>
114
              <img src="images/soc_11.jpg" alt="soc">
115
            </a>
116
          </td>
117
          <td>
118
            <a>
119
              <img src="images/soc_12.jpg" alt="soc">
120
            </a>
121
          </td>
122
          <td>
123
            <a>
124
              <img src="images/soc_13.jpg" alt="soc">
125
            </a>
126
          </td>
127
          <td>
128
            <a>
129
              <img src="images/soc_14.jpg" alt="soc">
130
            </a>
131
          </td>
132
          <td>
133
            <a>
134
              <img src="images/soc_15.jpg" alt="soc">
135
            </a>
136
          </td>
137
        </tr>
138
      </table>
139
    </div>
140
    <div class="twitter">
141
      <p>Twitter Updates</p>
142
      <div>
143
        <p><span>@bogothemes</span> there is a new<br> designer in town people!</p>
144
        <p>Check it out: <a href="#">http://bit.urds</a></p>
145
      </div>
146
    </div>
147
    <div class="clear"></div>
148
  </div>
149
 </body>
150
</html>
 
CSS 
.bottom_menu {
1
.bottom_menu {
2
  background-color: #121212;
3
 
4
}
5
 
6
.bottom_menu>div>p {
7
  color: #fff;
8
  font-size: 18pt;
9
}
10
.clear {clear:both}
11
.about, .popular, .follow, .twitter {
12
  float:left;
13
}
14
 
15
.bottom_menu .about {
16
  margin-left: 3%;
17
}
18
 
19
.bottom_menu .about ul {
20
  margin: 0;
21
  padding: 0;
22
}
23
 
24
.bottom_menu .about ul li{
25
  list-style: none;
26
  margin-bottom: 2px;
27
}
28
 
29
.bottom_menu .about ul li a {
30
  text-decoration: none;
31
  color: #4a4a4a;
32
}
33
 
34
.bottom_menu .popular {
35
  margin-left: 10%;
36
}
37
 
38
.bottom_menu .popular ul {
39
  margin: 0;
40
  padding: 0;
41
}
42
 
43
.bottom_menu .popular ul li {
44
  list-style: none;
45
  margin-bottom: 2px;
46
}
47
 
48
.bottom_menu .popular ul li a {
49
  text-decoration: none;
50
  color: #4a4a4a;
51
}
52
 
53
.bottom_menu .popular ul li a span {
54
  color: #a2a1a1;
55
}
56
 
57
.bottom_menu .follow {
58
  margin-left: 10%;
59
}
60
 
61
.bottom_menu .follow table tr td{
62
  padding: 2px;
63
}
64
 
65
.bottom_menu .follow table tr td a {
66
  display: block;
67
}
68
 
69
.bottom_menu .follow table tr td a img {
70
  width: 30px;
71
}
72
 
73
.bottom_menu .twitter {
74
  margin-left: 10%;
75
}
76
 
77
.bottom_menu .twitter div p {
78
  color: #4a4a4a;
79
}
80
 
81
.bottom_menu .twitter div p span {
82
  color: #b9b9b9;
83
}
84
 
85
.bottom_menu .twitter div p a {
86
  text-decoration: none;
87
  color: #4a4a4a;
88
}
 

Untitled

CSSDeck G+