Skip to content

Commit 55e2166

Browse files
ChrisFayadChrisFayad
committed
Removing 'display: inline-block' because 'float: left' only works with 'display: block/none'
1 parent 150cf32 commit 55e2166

File tree

1 file changed

+89
-86
lines changed

1 file changed

+89
-86
lines changed

‎styles.css‎

Lines changed: 89 additions & 86 deletions
Original file line numberDiff line numberDiff line change
@@ -1,118 +1,121 @@
1-
body{
2-
font-family: Tahoma;
3-
color: #444;
4-
letter-spacing: 1px;
1+
body {
2+
font-family: Tahoma;
3+
color: #444;
4+
letter-spacing: 1px;
55
}
66

7-
h1, h2{
8-
font-weight: normal;
7+
h1,
8+
h2 {
9+
font-weight: normal;
910
}
1011

11-
#wrapper{
12-
width: 90%;
13-
max-width: 960px;
14-
margin: 20px auto;
15-
border-radius: 6px;
16-
box-shadow: 0px 1px 6px rgba(0,0,0,0.2);
17-
box-sizing: border-box;
18-
padding: 0 0 20px;
19-
overflow: hidden;
20-
border: 1px solid lightgray;
12+
#wrapper {
13+
width: 90%;
14+
max-width: 960px;
15+
margin: 20px auto;
16+
border-radius: 6px;
17+
box-shadow: 0px 1px 6px rgba(0, 0, 0, 0.2);
18+
box-sizing: border-box;
19+
padding: 0 0 20px;
20+
overflow: hidden;
21+
border: 1px solid lightgray;
2122
}
2223

23-
#page-banner{
24-
background: #eee ;
25-
padding: 10px 0;
24+
#page-banner {
25+
background: #eee;
26+
padding: 10px 0;
27+
}
2628

29+
#page-banner h1,
30+
#page-banner p {
31+
width: 100%;
32+
text-align: center;
33+
margin: 10px 0;
2734
}
2835

29-
#page-banner h1, #page-banner p{
30-
width: 100%;
31-
text-align: center;
32-
margin: 10px 0;
36+
#page-banner input {
37+
width: 90%;
38+
max-width: 300px;
39+
margin: 20px auto;
40+
display: block;
41+
padding: 8px;
42+
border: 1px solid #ddd;
43+
border-radius: 4px;
44+
font-size: 16px;
45+
color: #444;
3346
}
3447

35-
#page-banner input{
36-
width: 90%;
37-
max-width: 300px;
38-
margin: 20px auto;
39-
display: block;
40-
padding: 8px;
41-
border: 1px solid #ddd;
42-
border-radius: 4px;
43-
font-size: 16px;
44-
color: #444;
48+
#book-list,
49+
#add-book,
50+
#tabbed-content {
51+
margin: 30px;
4552
}
4653

47-
#book-list, #add-book, #tabbed-content{
48-
margin: 30px;
54+
#book-list ul,
55+
#tabbed-content ul {
56+
list-style-type: none;
57+
padding: 0;
4958
}
5059

51-
#book-list ul, #tabbed-content ul{
52-
list-style-type: none;
53-
padding: 0;
60+
#book-list li {
61+
padding: 20px;
62+
border-left: 5px solid #ddd;
63+
margin: 20px 10px;
5464
}
5565

56-
#book-list li{
57-
padding: 20px;
58-
border-left: 5px solid #ddd;
59-
margin: 20px 10px;
66+
#book-list li:hover {
67+
border-color: #9361bf;
6068
}
6169

62-
#book-list li:hover{
63-
border-color: #9361bf;
70+
.delete {
71+
float: right;
72+
background: #9361bf;
73+
padding: 6px;
74+
border-radius: 4px;
75+
cursor: pointer;
76+
color: white;
6477
}
6578

66-
.delete{
67-
float: right;
68-
background: #9361bf;
69-
padding: 6px;
70-
border-radius: 4px;
71-
cursor: pointer;
72-
color: white;
79+
.delete:hover {
80+
background: #333;
7381
}
7482

75-
.delete:hover{
76-
background: #333;
83+
#add-book {
84+
width: 400px;
85+
margin: 0 auto;
7786
}
7887

79-
#add-book{
80-
width: 400px;
81-
margin: 0 auto;
88+
#add-book input {
89+
display: block;
90+
margin: 20px 0;
91+
padding: 10px;
92+
border: 1px solid #ccc;
93+
font-size: 16px;
94+
border-radius: 4px 0 0 4px;
95+
box-sizing: border-box;
96+
width: 300px;
97+
float: left;
8298
}
8399

84-
#add-book input{
85-
display: block;
86-
margin: 20px 0;
87-
padding: 10px;
88-
border: 1px solid #ccc;
89-
font-size: 16px;
90-
border-radius: 4px 0 0 4px;
91-
box-sizing: border-box;
92-
width: 300px;
93-
float: left;
94-
}
95-
96-
#add-book button{
97-
border: 1px solid #9361bf;
98-
background: #9361bf;
99-
padding: 10px 20px;
100-
font-size: 16px;
101-
display: inline-block;
102-
margin: 0;
103-
border-radius: 0 4px 4px 0;
104-
cursor: pointer;
105-
width: 100px;
106-
float: left;
107-
margin: 20px 0;
108-
border-left: 0;
109-
color: white;
100+
#add-book button {
101+
border: 1px solid #9361bf;
102+
background: #9361bf;
103+
padding: 10px 20px;
104+
font-size: 16px;
105+
margin: 0;
106+
border-radius: 0 4px 4px 0;
107+
cursor: pointer;
108+
width: 100px;
109+
float: left;
110+
margin: 20px 0;
111+
border-left: 0;
112+
color: white;
110113
}
111114

112-
#add-book:after{
113-
content: '';
114-
display: block;
115-
clear: both;
115+
#add-book:after {
116+
content: "";
117+
display: block;
118+
clear: both;
116119
}
117120

118121
/*

0 commit comments

Comments
 (0)