Skip to content

Diana #9

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
rabbitrg wants to merge 1 commit into
base: master
Choose a base branch
from
Open

Diana #9

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
111 changes: 111 additions & 0 deletions 360i.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,111 @@
<html>
<head>

Copy link
Contributor

@callihiggins callihiggins Feb 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You shouldn't be writing any of your content html in the <head>, that's for things like <title> or importing css or js files. This should all be inside of the <body> tag

<h1>360 i</h1>
<h2>
<div id="box">
Copy link
Contributor

@callihiggins callihiggins Feb 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You don't seem to close this <div>- this can create a ton of problems!

<div class = "box" id = "LogIn"><a href="main.html">LOG IN</a></div></h2>
Copy link
Contributor

@callihiggins callihiggins Feb 9, 2017 •
edited
Loading

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think we talked about this in class, but I would definitely eliminate the <h2> tag, or at the very least, only wrap it around the Log In text: <div class = "box" id = "LogIn"><a href="main.html"><h2>LOG IN</h2></a></div>

<h3>Lorem ipsum dolor sit amet,
consectetur adipiscing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation</h3>


<div class="img">
Copy link
Contributor

@callihiggins callihiggins Feb 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You also need to close this <div>!

<img src="image/background.jpg" style= "widht:100%; height:100%"; position:absolute;top:0 z-index: -1;>

<style>
Copy link
Contributor

@callihiggins callihiggins Feb 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Move your style to an external stylesheet-- like style.css that you then bring in via <link rel="stylesheet" type="text/css" href="style.css"> in the <head>



h1 {

position: absolute;
text-align: center;
font-size: 24px;
font-family: "Helvetica";
font-weight: medium;
letter-spacing: 2px;
padding: 130px 0px 0px 260px;
color: rgb(255, 1255, 255);

}

h2{position: absolute;
text-align: center;
font-size: 14px;
font-family: "Helvetica";
font-weight: lighter;
text-decoration: none;
padding: 600px 0px 20px 170px;
color: rgb(255,255,255);
margin: auto;
letter-spacing: 3px;
}

h3{position: absolute;
text-align: center;
font-size: 10px;
font-family: "Helvetica";
font-weight: lighter;
text-decoration: none;
padding: 200px 0px 20px 220px;
color: rgb(3, 196, 173);
margin: auto;
letter-spacing: 1px;
margin-top: 20px;
Copy link
Contributor

@callihiggins callihiggins Feb 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Keep your indentation specific- it will help keep you organized

margin-bottom: 100px;
margin-right: 600px;
margin-left: 0px;
}

a:link {text-decoration: : none;
color: rgb(255,255,255);
}

a:hover, a:active {
color: rgb(196, 3, 176);
text-decoration: none;
}



#LogIn {


position:center;
width: 100% ;
height:2%;
margin:auto;
padding: 10px;
padding-right:80px;
background-color: rgba(255, 255, 255, 0.3);
border-radius: 10px;
box-shadow: rgba(0,0,0,0.1);

}



</<style>
</head>
<body>



Copy link
Contributor

@callihiggins callihiggins Feb 9, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

All of the html you want to be rendered to the page should be inside of here







</body>









</html>
Binary file added image/background.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added image/background2.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added image/background3.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added image/logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
Binary file added logo.png
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
134 changes: 134 additions & 0 deletions main.html
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,134 @@
<html>
<head>

<h1>360i</h1>
<h2>
<div id="box">
<div class = "box" id = "LogIn"><a href="main.html">LOG IN</a></div>
</h2>
<h3>Lorem ipsum dolor sit amet,
consectetur adipiscing elit, sed do eiusmod tempor incididunt
ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation</h3>

<div id="category1">
<h4>Category1</h4></div>


<div class="img">
<img src="image/background3.jpg" style= "widht:100%; height:100%"; position:absolute;top:0 z-index: -1;>
<style>


h1 {

position: absolute;
text-align: center;
font-size: 24px;
font-family: "Helvetica";
font-weight: medium;
letter-spacing: 2px;
padding: 130px 0px 0px 260px;
color: rgb(255,255,255);
margin: auto;
overflow: visible;
}

h2{position: absolute;
text-align: center;
font-size: 14px;
font-family: "Helvetica";
font-weight: lighter;
text-decoration: none;
padding: 600px 0px 20px 170px;
color: rgb(255,255,255);
margin: auto;
letter-spacing: 3px;
}

h3{position: absolute;
text-align: center;
font-size: 10px;
font-family: "Helvetica";
font-weight: lighter;
text-decoration: none;
padding: 200px 0px 20px 220px;
color: rgb(3, 196, 173);
margin: auto;
letter-spacing: 1px;
margin-top: 20px;
margin-bottom: 100px;
margin-right: 600px;
margin-left: 0px;
}

a:link {text-decoration: : none;
color: rgb(255,255,255);
}

a:hover, a:active {
color: rgb(196, 3, 176);
text-decoration: none;
}



#LogIn {


position: relative;
width: 1100px ;
height: 1000px;
margin-top: 20px;
margin-bottom: 100px;

padding: 100px 0px 0px 130px;



background-color: rgba(255,255,255, 0.1);
border-radius: 10px;

}


h4 { position: absolute;
text-align: center;
font-family: "Helvetica";
font-size: 18px;
font-weight: lighter;
text-decoration: none;
padding: 19px 0px 0px 48px;
color: rgb(72, 11, 130);
margin: auto;
letter-spacing: 3px;
}


#category1 {position: absolute;
width: 200px ;
height: 60px;
margin-top: 800px;
margin-left: 350px;


padding: 0px 0px 0px 0px;



background-color: rgba(255,255,255,0.3);
border-radius: 10px;}

</<style>
</head>
<body>









</body>