-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
129 lines (128 loc) · 5.21 KB
/
index.html
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
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>WD Contents | Woman’s Day</title>
<meta name="robots" content="noindex, nofollow" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" type="text/css" href="css/normalize.css">
<link rel="stylesheet" type="text/css" href="css/styles.css">
</head>
<body>
<div id="container">
<!-- classes that begin with 'item' are grid items. I don't believe you absolutely have to use the key word "item" but I've seen it done in multiple examples -->
<header class="item header">
<p>February 10, 2009 • 72nd Year • 5th Issue</p>
<h1>WD Contents</h1>
</header>
<main class="item main">
<!-- This is a nested grid, similar to the concept of using multiple flex-containers to hold different pieces of content. The children of a grid container are its items. Since the elements nested inside my main tag are not children of my initial grid (#id-container), I am nesting a grid inside of my main item and creating a grid within a grid. Now, the elements nested inside of my main tags are all grid items of my main_grid and can be easily positioned within it. -->
<div id="main_grid">
<section class="item section1">
<h2>Live Well</h2>
<ol>
<li value="11">
<h3>Take Time To</h3>
<p><strong>Make a snow globe for your valentine.</strong></p>
</li>
<li value="12">
<h3>How To…</h3>
<p>jazz up your V-day plans, choose a flattering shade of red, get your home company ready fast.</p>
</li>
<li value="16">
<h3>WomansDay.com</h3>
<p>A Valentine gift guide, 20 heart shaped desserts, <q>Most Romantic Husband</q> contest.</p>
</li>
<li value="20">
<h3>Reinventing Date Night</h3>
<p>Dinner and a movie getting stale? Put back the zing <em>by Andrea Atkins</em></p>
</li>
<li value="26">
<h3>Momfidence</h3>
<p><strong>Stop, kiss and listen</strong> <em>by Paula Spencer.</em></p>
</li>
</ol>
</section>
<section class="item section2">
<h2>Style</h2>
<ol>
<li value="31">
<h3>Take Time To</h3>
<p><strong>Pick bright floral prints.</strong></p>
</li>
<li value="32">
<h3>Beauty Closet</h3>
<p>Winter blues? Ravishing red products will chase them away <em>by Melissa Matthews.</em></p>
</li>
<li value="36">
<h3>Pretty In Red</h3>
<p>Four heart disease survivors share their inspiring stories–and we treat them to a red carpet-worthy makeover.</p>
</li>
</ol>
</section>
<section class="item section3">
<h2>Health</h2>
<ol>
<li value="47">
<h3>Take Time To</h3>
<p><strong>Choose red fruits and veggies.</strong></p>
</li>
<li value="49">
<h3>4 Fridays To A Health Heart</h3>
<p>Celebrate American Heart Month by being good to yourself and following our easy ways to prevent heart disease.</p>
</li>
<li value="52">
<h3>Your Health</h3>
<p>Tips for easing winter allergies, a heart disease risk test, is a toothbrus sanitizer worth it?</p>
</li>
<li value="55">
<h3>Checkup</h3>
<p><abbr title="Temporal-Mandibular Joint">TMJ</abbr> <em>by Donna Christiano</em></p>
</li>
<li value="56">
<h3>25 Medical Mistakes</h3>
<p>Take these steps to prevent mishaps now! <em>by Alyssa Shaffer.</em></p>
</li>
<li value="68">
<h3>The Heart-Healthy Kitchen Makeover</h3>
<p>A WD reader gets an eating-habit overhaul <em>by Marissa Lippert, RDS</em></p>
</li>
<li value="72">
<h3>Your Child’s Health</h3>
<p>New vitamins D guidelines, pets to avoid, and more <em>by Madonna Behen.</em></p>
</li>
<li value="76">
<h3>Blast Belly Fat</h3>
<p>Walking routines and strength training moves to whittle your middle in no time… um, flat <em>by Karen Asp</em> ▶</li>
</ol>
</section>
<aside class="item aside1">
<figure>
<!-- image obtained from: https://savedbythedress.com/collections/tops-styles/products/navy-floral-top-with-ruffle-pocket-utm_campaign-la1 -->
<img src="images/floral.jpg" alt="Young woman in a floral top" />
<figcaption>
<p><em>31</em> Cure the midwinter clothing blahs.</p>
<p>Keith Lathrop</p>
</figcaption>
</figure>
</aside>
<aside class="item aside2">
<h2>On Our Cover</h2>
<p><em>Red-hot dinners and sweets to share</em> pages 107 (cover recipe), 110, 118</p>
<ol>
<li value="76">From Belly Fat to Belly Flat: 3 Walks</li>
<li value="92">Slash Your Grocery Bill, and Other Secrets of Super Savers</li>
<li value="56">Save Your Life! 25 Medical Mistakes to Avoid</li>
<li value="98">Spend Smart: New Rules, Tough Times</li>
<li value="121">Free Recipe Cards: 15-Minute Dinners</li>
<li value="86">Operation Get Organized</li>
</ol>
</aside>
</div><!--end of main grid-->
</main>
<footer class="item footer">
<p><small><time datetime="2009-02-10">February 10, 2009</time> <em>●</em> WomansDay.com <strong>1</strong></small></p>
</footer>
</div><!-- end #container -->
</body>
</html>