Skip to content

Commit d16b179

Browse files
gant123gant123
committed
Correct
changes made
1 parent 88c3f5e commit d16b179

File tree

2 files changed

+133
-43
lines changed

2 files changed

+133
-43
lines changed

‎great-idea-website/css/index.css

+74-1
Original file line numberDiff line numberDiff line change
@@ -63,4 +63,77 @@ h1, h2, h3, h4, h5 {
6363
margin-bottom: 15px;
6464
}
6565

66-
/* Your code starts here! */
66+
/* Your code starts here! */
67+
.container {
68+
width: 876px;
69+
margin: 0 auto;
70+
}
71+
.nav-bar {
72+
height: 60px;
73+
width: 886px;
74+
border-radius: 15px;
75+
/*position: fixed;*/
76+
top: 5px;
77+
78+
}
79+
a {
80+
text-align: center;
81+
display: inline-block;
82+
top: 5px;
83+
padding: 20px;
84+
color: grey;
85+
text-decoration: none;
86+
87+
}
88+
.logo {
89+
display: inline-block;
90+
top: 5px;
91+
margin-left: 100px;
92+
}
93+
.head-font {
94+
font-size: 65px;
95+
display: inline-block;
96+
text-align: center;
97+
}
98+
.circle-image {
99+
display: inline-block;
100+
margin-left: 54px;
101+
}
102+
.section2 {
103+
padding: 50px 0px 50px 125px;
104+
}
105+
button {
106+
background: white;
107+
padding: 5px 40px;
108+
border-color: black;
109+
display: block;
110+
margin-left: 55px;
111+
}
112+
.top-content-p {
113+
display: inline-block;
114+
vertical-align: top;
115+
width: 436px;
116+
text-align: left;
117+
margin-top: 30px;
118+
margin-bottom: 30px;
119+
}
120+
.bottom-content-p {
121+
display: inline-block;
122+
vertical-align: top;
123+
width: 289px;
124+
text-align: left;
125+
margin-top: 30px;
126+
margin-bottom: 30px;
127+
}
128+
.address{
129+
margin-top: 30px;
130+
margin-bottom: 30px;
131+
text-align: left;
132+
133+
}
134+
.address p {
135+
margin-top: 30px;
136+
}
137+
footer {
138+
text-align: center;
139+
}

‎great-idea-website/index.html

+59-42
Original file line numberDiff line numberDiff line change
@@ -15,49 +15,66 @@
1515
</head>
1616

1717
<body>
18-
19-
Services
20-
Product
21-
Vision
22-
Features
23-
About
24-
Contact
25-
26-
<img class="logo" src="img/logo.png" alt="Great Idea! Company logo.">
27-
Innovation
28-
On
29-
Demand
30-
31-
Get Started
32-
33-
<img src="img/header-img.png" alt="Image of a code snippet.">
34-
35-
Features
36-
Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.
37-
38-
39-
About
40-
Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.
41-
42-
<img class="middle-img" src="img/mid-page-accent.jpg" alt="Image of code snippets across the screen">
18+
<div class="container">
19+
<section class="nav-bar">
20+
<nav>
21+
<a href="#">Services</a>
22+
<a href="#">Product</a>
23+
<a href="#">Vision</a>
24+
<a href="#">Features</a>
25+
<a href="#">About</a>
26+
<a href="#">Contact</a>
27+
<img class="logo" src="img/logo.png" alt="Great Idea! Company logo.">
28+
</nav>
4329

44-
Services
45-
Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.
46-
47-
48-
Product
49-
Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.
50-
51-
Vision
52-
Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.
53-
54-
Contact
55-
123 Way 456 Street
56-
Somewhere, USA
57-
1 (888) 888-8888
58-
[email protected]
59-
60-
Copyright Great Idea! 2018
30+
</section>
31+
<section class="section2">
32+
<div class="head-font">
33+
<h1>Innovation</h1>
34+
<h1>On</h1>
35+
<h1>Demand</h1>
36+
<button>Get Started</button>
37+
</div>
6138

39+
<img class="circle-image" src="img/header-img.png" alt="Image of a code snippet.">
40+
</section>
41+
<hr>
42+
<section class="top-content-p">
43+
<h2>Features</h2>
44+
<p>Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.</p>
45+
</section>
46+
<section class="top-content-p">
47+
<h2>About</h2>
48+
<p>Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.</p>
49+
</section>
50+
<section>
51+
<img class="middle-img" src="img/mid-page-accent.jpg" alt="Image of code snippets across the screen">
52+
</section>
53+
<section class="bottom-content-p">
54+
<h2>Services</h2>
55+
<p>Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.</p>
56+
</section>
57+
<section class="bottom-content-p">
58+
<h2>Product</h2>
59+
<p>Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.</p>
60+
</section>
61+
<section class="bottom-content-p">
62+
<h2>Vision</h2>
63+
<p>Aliquam elementum magna eros, ac posuere elvit tempus et. Suspendisse vel tempus odio, in interdutm nisi. Suspendisse eu ornare nisl. Nullam convallis augue justo, at imperdiet metus scelerisque quis.</p>
64+
</section>
65+
<hr>
66+
<section class="address">
67+
<h2>Contact</h2>
68+
<address>
69+
123 Way 456 Street
70+
Somewhere, USA
71+
</address>
72+
<p>1 (888) 888-8888</p>
73+
<p>[email protected]</p>
74+
</section>
75+
<footer>
76+
Copyright Great Idea! 2018
77+
</footer>
78+
</div>
6279
</body>
6380
</html>

0 commit comments

Comments
 (0)