Skip to content

Commit dd15791

Browse files
matowdevmatowdev
committed
[proj. Lounge] Chg. location "elixirs" blk, float
Correction the main/page structure, application of float property. LP from Books
1 parent 530447d commit dd15791

3 files changed

Lines changed: 67 additions & 55 deletions

File tree

‎Learning_HTML_CSS_Freeman_E/Lounge/css/mediaquery.css‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -22,7 +22,7 @@
2222
line-height: 1.9em;
2323
font-style: italic;
2424
font-family: Georgia, "Times New Roman", Times, serif;
25-
color: #444444;
25+
color: #444;
2626
border-color: white;
2727
border-width: 1px;
2828
border-style: dashed;
@@ -31,7 +31,7 @@
3131
padding-left: 80px;
3232
margin: 30px;
3333
margin-right: 250px;
34-
background-image: url(images/background.gif);
34+
background-image: url("images/background.gif");
3535
background-repeat: no-repeat;
3636
background-position: top left;
3737
}
@@ -61,7 +61,7 @@
6161
line-height: 1.9em;
6262
font-style: italic;
6363
font-family: Georgia, "Times New Roman", Times, serif;
64-
color: #444444;
64+
color: #444;
6565
border-color: white;
6666
border-width: 1px;
6767
border-style: dashed;
@@ -101,7 +101,7 @@
101101
line-height: 1.5em;
102102
font-style: italic;
103103
font-family: Georgia, "Times New Roman", Times, serif;
104-
color: #222222;
104+
color: #222;
105105
}
106106

107107
#elixirs {
@@ -121,15 +121,15 @@
121121
color: #007e7e;
122122
}
123123
#elixirs a:visited {
124-
color: #333333;
124+
color: #333;
125125
}
126126
#elixirs a:hover {
127127
background: #f88396;
128128
color: #0d5353;
129129
}
130130

131131
#elixirs h2 {
132-
color: #000000;
132+
color: #000;
133133
}
134134

135135
#elixirs h3 {
@@ -163,6 +163,6 @@
163163
color: #007e7e;
164164
}
165165
body p a:visited {
166-
color: #333333;
166+
color: #333;
167167
}
168168
}

‎Learning_HTML_CSS_Freeman_E/Lounge/css/style.css‎

Lines changed: 34 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -17,35 +17,19 @@ h2 {
1717
font-size: 130%;
1818
}
1919

20-
#guarantee {
21-
margin: 30px;
22-
margin-right: 250px;
23-
border: 2px dashed white;
24-
padding: 25px;
25-
padding-left: 80px;
26-
line-height: 1.9em;
27-
font-family: Georgia, Times, serif;
28-
color: #444;
29-
background: #a7cece url("../images/background.gif") no-repeat top left;
30-
}
31-
32-
a:link {
33-
color: green;
34-
}
35-
36-
a:visited {
37-
color: red;
38-
}
39-
40-
a:hover {
41-
color: orange;
20+
.page {
21+
margin: 0 auto;
22+
padding: 0 50px 20px;
23+
max-width: 1200px;
24+
min-height: 1170px;
4225
}
4326

4427
#elixirs {
4528
margin-left: 20px;
4629
border: 1px solid #007e7e;
4730
padding: 0 20px 20px;
4831
width: 200px;
32+
float: right;
4933
line-height: 1.1;
5034
text-align: center;
5135
background: white url("../images/cocktail.gif") repeat-x;
@@ -72,6 +56,34 @@ a:hover {
7256
color: #0d5353;
7357
}
7458

59+
#guarantee {
60+
margin: 30px;
61+
margin-right: 250px;
62+
border: 2px dashed white;
63+
padding: 25px;
64+
padding-left: 80px;
65+
line-height: 1.9em;
66+
font-family: Georgia, Times, serif;
67+
color: #444;
68+
background: #a7cece url("../images/background.gif") no-repeat top left;
69+
}
70+
71+
a:link {
72+
color: green;
73+
}
74+
75+
a:visited {
76+
color: red;
77+
}
78+
79+
a:hover {
80+
color: orange;
81+
}
82+
83+
.music-list {
84+
margin-bottom: 220px;
85+
}
86+
7587
.cd {
7688
font-style: italic;
7789
}

‎Learning_HTML_CSS_Freeman_E/Lounge/lounge.html‎

Lines changed: 26 additions & 26 deletions
Original file line numberDiff line numberDiff line change
@@ -8,14 +8,35 @@
88
<link rel="stylesheet" href="css/style.css" media="screen and (min-width: 769px)">
99
<link rel="stylesheet" href="css/mobile.css" media="screen and (max-width: 768px)">
1010
<link rel="stylesheet" href="css/print.css" media="print">
11-
1211
</head>
1312

14-
<body>
13+
<body class="page">
1514
<p><img src="images/logo.gif" alt="Head First Lounge"></p>
1615

1716
<h1>Welcome to the Head First Lounge</h1>
1817

18+
<div id="elixirs">
19+
<h2>Weekly Elixir Specials</h2>
20+
21+
<p><img src="images/yellow.gif" alt="Lemon Breeze Elixir"></p>
22+
<h3>Lemon Breeze</h3>
23+
<p class="text">The ultimate healthy drink, this elixir combines herbal botanicals, minerals, and vitamins with
24+
a twist of lemon into a smooth citrus wonder that will keep your immune system going all day and all night.</p>
25+
26+
<p><img src="images/chai.gif" alt="Chai Chiller Elixir"></p>
27+
<h3>Chai Chiller</h3>
28+
<p class="text">Not your traditional chai, this elixir mixes mat&eacute; with chai spices and adds an extra
29+
chocolate kick for a caffeinated taste sensation on ice.</p>
30+
31+
<p><img src="images/black.gif" alt="Black Brain Brew Elixir"></p>
32+
<h3>Black Brain Brew</h3>
33+
<p class="text">Want to boost your memory? Try our Black Brain Brew elixir, made with black oolong tea and just a
34+
touch of espresso. Your brain will thank you for the boost.</p>
35+
36+
<p class="text">Join us any evening for these and all our other wonderful <a href="beverages/elixir.html"
37+
title="Head First Lounge Elixirs">elixirs</a>.</p>
38+
</div>
39+
1940
<p class="text">The Head First Lounge is, no doubt, the biggest trendsetter in Webville. Stop in to sample the
2041
eclectic offering of elixirs, teas, and coffees, or, stay a bit longer and enjoy the multicultural culinary menu
2142
that combines a harmony of taste, texture, and color with the best in fresh and healthy ingredients.</p>
@@ -37,36 +58,15 @@ <h1>Welcome to the Head First Lounge</h1>
3758
find yourself in the lounge, you'll always be connected with our wireless Internet access.</p>
3859
<p class="text">Now that you've experienced the lounge <em>virtually</em>, isn't it time to check us out <em>for
3960
real</em>? We're located right in the heart of Webville, and we've created some <a href="about/directions.html"
40-
title="Detailed Directions to the Lounge">detailed directions</a> to get you here in record time. No reservations
61+
title="Detailed Directions to the Lounge">detailed directions</a> to get you here in
62+
record time. No reservations
4163
necessary; come and join us anytime.</p>
4264

43-
<div id="elixirs">
44-
<h2>Weekly Elixir Specials</h2>
45-
46-
<p><img src="images/yellow.gif" alt="Lemon Breeze Elixir"></p>
47-
<h3>Lemon Breeze</h3>
48-
<p class="text">The ultimate healthy drink, this elixir combines herbal botanicals, minerals, and vitamins with
49-
a twist of lemon into a smooth citrus wonder that will keep your immune system going all day and all night.</p>
50-
51-
<p><img src="images/chai.gif" alt="Chai Chiller Elixir"></p>
52-
<h3>Chai Chiller</h3>
53-
<p class="text">Not your traditional chai, this elixir mixes mat&eacute; with chai spices and adds an extra
54-
chocolate kick for a caffeinated taste sensation on ice.</p>
55-
56-
<p><img src="images/black.gif" alt="Black Brain Brew Elixir"></p>
57-
<h3>Black Brain Brew</h3>
58-
<p class="text">Want to boost your memory? Try our Black Brain Brew elixir, made with black oolong tea and just a
59-
touch of espresso. Your brain will thank you for the boost.</p>
60-
61-
<p class="text">Join us any evening for these and all our other wonderful <a href="beverages/elixir.html"
62-
title="Head First Lounge Elixirs">elixirs</a>.</p>
63-
</div>
64-
6565
<h2>What's playing at the Lounge</h2>
6666
<p class="text">We're frequently asked about the music we play at the lounge, and no wonder, it's great stuff. Just
6767
for you, we keep a list here on the site, updated weekly. Enjoy.</p>
6868

69-
<ul>
69+
<ul class="music-list">
7070
<li><span class="cd">Buddha Bar</span>, <span class="artist">Claude Challe</span></li>
7171
<li><span class="cd">When It Falls</span>, <span class="artist">Zero 7</span></li>
7272
<li><span class="cd">Earth 7</span>, <span class="artist">L.T.J. Bukem</span></li>

0 commit comments

Comments
 (0)