Get up to 80 % extra points for free! More info:

Discussion: my first website... html page

Activities
Avatar
VINCENT EVERGREEN
Member
Avatar
VINCENT EVERGREEN:2/3/2017 15:04

<!doctype html>
<html lang="en">

<head>

<meta charset="utf-8"/>
<link rel="styesheet" href="style.css" type="text/css" />
<title>index.html</ti­tle>
</head>
<body>

<h1> WELCOME TO MY FIRST WEBSITE</h1>
<img src="web photos\candles.jpg" alt="vin the programmer>
<p>My name is <h2><strong>VINCENT EVERGREEN N.</strong></h2> this is is my first website. i am learning html and web design with tutorials at <a href="http://­www.ict.social"> ICT.SOCIAL</a>
To know more about me, visit my <a href="contactpa­ge.html"> CONTACT PAGE </a> thank you and you are highly welcome.</p>

</body>
</html>

 
Reply
2/3/2017 15:04
Avatar
IT Man
Member
Avatar
Replies to VINCENT EVERGREEN
IT Man:2/3/2017 16:42
  1. You can write anything in title, not just name of file.
  2. h2 is separate tag. It shouldn't be in p. You can use this:
<p>My name is <span class="name">Vincent Evergreen N.</span> and this is my first website. ...

And then add into style.css this:

.name {
    font-size: 1.2em;
}
 
Up Reply
2/3/2017 16:42
Avatar
VINCENT EVERGREEN
Member
Avatar
Replies to IT Man
VINCENT EVERGREEN:2/3/2017 16:49

My main challenge is how And where to put my link to CSS page In the html document... Please start the linking from the head so that I can get the linking steps... Thanks IT MAN

 
Up Reply
2/3/2017 16:49
Avatar
VINCENT EVERGREEN
Member
Avatar
Replies to VINCENT EVERGREEN
VINCENT EVERGREEN:2/3/2017 16:51

The place I inserted the "link" tag, is that its position?...

Accepted solution
+5 Experiences
Problem solution
 
Up Reply
2/3/2017 16:51
Avatar
IT Man
Member
Avatar
Replies to VINCENT EVERGREEN
IT Man:2/4/2017 2:17

Yes, link should be in head. :)

 
Up Reply
2/4/2017 2:17
Avatar
VINCENT EVERGREEN
Member
Avatar
Replies to VINCENT EVERGREEN
VINCENT EVERGREEN:2/5/2017 9:10

Give me the example ... Please...

 
Up Reply
2/5/2017 9:10
Avatar
David Capka
ICT.social team
Avatar
Replies to VINCENT EVERGREEN
David Capka:2/5/2017 13:52

You got a typo in the word "styesheet" ;-)

Up Reply
2/5/2017 13:52
You can walk through a storm and feel the wind but you know you are not the wind.
Avatar
VINCENT EVERGREEN
Member
Avatar
Replies to David Capka
VINCENT EVERGREEN:2/5/2017 14:07

Irrespective of that... still its not advancing... corrected. Should i rewrite the html codes together with the css'..

 
Up Reply
2/5/2017 14:07
Avatar
David Capka
ICT.social team
Avatar
Replies to VINCENT EVERGREEN
David Capka:2/5/2017 14:50

And what's the problem, CSS doesn't work at all? Can you post your CSS file as well or upload the whole website somewhere and post me the link so I can check it?

Up Reply
2/5/2017 14:50
You can walk through a storm and feel the wind but you know you are not the wind.
Avatar
lawrence njoroge
Member
Avatar
lawrence njoroge:2/10/2017 8:54

my aside content can get borders assist me please.
my html code
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<title>GOOD LIVING</title>
<link rel="stylesheet" href="glv.css"/>
</head>
<body>
<div class="container">
<header>
<img src="images/lo­go.JPG" alt="logo area"class="logo"/>
<nav class="top_nav">
<ul>
<li><a href="">HOME </a></li>
<li><a href="">ABOUT </a></li>
<li><a href="">CONTACTS </a></li>
<li><a href="">DOWNLO­ADS</a></li>
<li><a href="">BLOG </a></li>
</ul>

</nav>
<div class="clear"></div>
</header>

<section class="left_side">
<article>
<header>
<h2> this is the article header<H2>
<h3>this is the subtitle</h3>
</header>
<p>this is paragraph 1</p>
<p>this is paragraph 2</p>
<footer>
-written by lawre
</footer>
</article>
</section>

<aside class="rigth_side">
<div>
<h2>social links</h2>
<ul>
<li><a href="">facebo­ok</a></li>
<li><a href="">twitter</a></li>
<li><a href="">linke­din</a></li>
</ul
</div>
<div>
<h2>Related stories</h2>
</div>

</aside>

<footer class="page_fo­oter">
©goodliving.com
</footer>
</div>

</body>
</html>

my css code
/*get rid of default margin and padding*/
*{
margin:opx;
padding:0px;
list-style-type:none;
}

header,nav,ar­ticle,section,fo­oter,aside{
display:block;
}
/*centering website*/
.container{
width:1000px;
margin:0px auto;
}

.clear{
clear: both;
}
.logo{
height:80px ;
width:100px;
float:left;
}
.top_nav{
float:left;
width:900;
}
.top_nav ul li{
float:left;
padding:35px 20px;

}
/*float aside and the main section*/
.left_side{
float:left;
width:700px;

}

.left_side article{
border:2px solid red;
margin-right:1opx;
padding:10px;
}
.right_side{
float:left;
width:300px;
}
.right_side div{
border:2px solid blue;
padding:10px;
margin:10px 0px;
}
/*make footer clear floated elements*/
.page_footer{
clear:both;
text-align:center;
}

Up Reply
2/10/2017 8:54
where there is will there is a way
Avatar
lawrence njoroge
Member
Avatar
Replies to David Capka
lawrence njoroge:2/10/2017 9:49

well the website is not uploaded to the server

<!DOCTYPE HTML>
<html>
<head>
        <meta charset="utf-8"/>
        <title>GOOD LIVING</title>
        <link rel="stylesheet" href="glv.css"/>
</head>
        <body>
        <div class="container">
                <header>
                        <img src="images/logo.JPG" alt="logo area"class="logo"/>
                                <nav class="top_nav">
                                        <ul>
                                                <li><a href="">HOME </a></li>
                                                <li><a href="">ABOUT </a></li>
                                                <li><a href="">CONTACTS </a></li>
                                                <li><a href="">DOWNLOADS</a></li>
                                                <li><a href="">BLOG </a></li>
                                        </ul>

                                </nav>
                                <div class="clear"></div>
                </header>

                <section class="left_side">
                        <article>
                                <header>
                                        <h2> this is the article header<H2>
                                        <h3>this is the subtitle</h3>
                                </header>
                                <p>this is paragraph 1</p>
                                <p>this is paragraph 2</p>
                                <footer>
                                        -written by lawre
                                </footer>
                        </article>
                </section>

                <aside class="rigth_side">
                        <div>
                                <h2>social links</h2>
                                <ul>
                                        <li><a href="">facebook</a></li>
                                        <li><a href="">twitter</a></li>
                                        <li><a href="">linkedin</a></li>
                                </ul
                        </div>
                                <div>
                                        <h2>Related stories</h2>
                                </div>

                </aside>

                        <footer class="page_footer">
                                &copy;goodliving.com
                        </footer>
        </div>

        </body>
</html>
/*get rid of  default margin and padding*/
*{
        margin:opx;
        padding:0px;
        list-style-type:none;
}

header,nav,article,section,footer,aside{
        display:block;
}
/*centering website*/
.container{
        width:1000px;
        margin:0px auto;
}

.clear{
        clear: both;
}
.logo{
        height:80px ;
        width:100px;
        float:left;
}
.top_nav{
        float:left;
        width:900;
}
.top_nav ul li{
        float:left;
        padding:35px 20px;

}
/*float aside and the main section*/
.left_side{
        float:left;
        width:700px;

}

.left_side article{
        border:2px solid red;
        margin-right:1opx;
        padding:10px;
}
.right_side{
        float:left;
        width:300px;
}
.right_side div{
        border:2px solid blue;
        padding:10px;
        margin:10px 0px;
}
/*make footer clear floated elements*/
.page_footer{
        clear:both;
        text-align:center;
}
Up Reply
2/10/2017 9:49
where there is will there is a way
Avatar
lawrence njoroge
Member
Avatar
Replies to lawrence njoroge
lawrence njoroge:2/10/2017 9:50

note that some pages are not made yet

Up Reply
2/10/2017 9:50
where there is will there is a way
Avatar

Member
Avatar
Replies to lawrence njoroge
:2/11/2017 18:32

Hi Lawrence, I don't see you ask any question. Do you have any problem with your code?

 
Up Reply
2/11/2017 18:32
Avatar
lawrence njoroge
Member
Avatar
Replies to
lawrence njoroge:2/13/2017 3:45

yes the aside tag cannot take my borders

Up Reply
2/13/2017 3:45
where there is will there is a way
Avatar

Member
Avatar
Replies to lawrence njoroge
:2/13/2017 8:03

Hi Lawrence, I see tipo in your html code, you have rigth_side instead of right_side

<aside class="rigth_side">

 
Up Reply
2/13/2017 8:03
Avatar
lawrence njoroge
Member
Avatar
Replies to
lawrence njoroge:2/15/2017 1:29

let me check

Up Reply
2/15/2017 1:29
where there is will there is a way
Avatar
lawrence njoroge
Member
Avatar
Replies to
lawrence njoroge:2/15/2017 1:32

thankyou it working now 8-)

Up Reply
2/15/2017 1:32
where there is will there is a way
Avatar
IT Man
Member
Avatar
Replies to lawrence njoroge
IT Man:2/15/2017 10:32

You can tag his comment as resolution with ✓. :)

 
Up Reply
2/15/2017 10:32
Avatar

Member
Avatar
Replies to IT Man
:2/19/2017 12:08

No, he cannot :D this is not Lawrence's thread.

 
Up Reply
2/19/2017 12:08
Avatar
David Capka
ICT.social team
Avatar
David Capka:2/19/2017 12:33

Is any of you guys interested in moderating the forums? :)

Up Reply
2/19/2017 12:33
You can walk through a storm and feel the wind but you know you are not the wind.
Avatar
Daniel Vitek
Member
Avatar
Replies to David Capka
Daniel Vitek:2/19/2017 14:19

I am :P

 
Up Reply
2/19/2017 14:19
Avatar
IT Man
Member
Avatar
Replies to
IT Man:2/19/2017 16:28

Oh, I see. Thanks for notice. :D
David Capka, yes, no problem. HTML & CSS is my second home. :P

 
Up Reply
2/19/2017 16:28
Avatar

Member
Avatar
Replies to David Capka
:2/19/2017 16:29

I am too :P I have nothing better to do anyway :D

 
Up Reply
2/19/2017 16:29
Avatar
lawrence njoroge
Member
Avatar
lawrence njoroge:2/21/2017 1:02

well guys thanks alot, am now trying to create a login system using php and no matter how i try i cant connect the pages to my local host server which is xampp any one who can help me please ill be greatiful

Up Reply
2/21/2017 1:02
where there is will there is a way
Avatar

Member
Avatar
Replies to lawrence njoroge
:2/21/2017 17:08

You should create new thread in PHP forum - https://www.ict.social/php/php-forum
Don't forget to add your code inside tags for code so we can see what you got :)

 
Up Reply
2/21/2017 17:08
Avatar
mick
Member
Avatar
mick:9/19/2022 2:55

Thanks for this interesting information!

 
Up Reply
9/19/2022 2:55
Avatar
mick
Member
Avatar
mick:9/21/2022 4:30

QA engineers are responsible for testing the software's performance https://mlsdev.com . They check that different components are functional and that the solution provides a sufficient level of security. They also check compatibility with other applications. They also check for bugs in previously-tested code, especially when adding new features or updates. Moreover, they use automated testing tools to ensure that the software meets its specifications.

 
Up Reply
9/21/2022 4:30
Avatar
Gaurav Negi
Member
Avatar
Gaurav Negi:2. August 10:46

Well, there are some logical issue with your code:

Try below code once for better output.

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="style.css" type="text/css" />
    <title>index.html</title>
</head>

<body>
    <h1> WELCOME TO MY FIRST WEBSITE</h1>
    <img src="web photos\candles.jpg" alt="vin the programmer">
    <p>My name is <strong>VINCENT EVERGREEN N.</strong> this is my first website. I am learning HTML and web design with tutorials at <a href="http://www.ict.social">ICT.SOCIAL</a>.
        To know more about me, visit my <a href="contactpage.html">CONTACT PAGE</a>. Thank you, and you are highly welcome.</p>
</body>

</html>

Thanks

 
Up Reply
2. August 10:46
Avatar
Gaurav Negi
Member
Avatar
Replies to VINCENT EVERGREEN
Gaurav Negi:20. September 11:27

Question is old however I would like to give my opinion on this.
Well, you have missed CSS link, you can try belos code where CSS link has been added.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <link rel="stylesheet" type="text/css" href="style.css">
    <title>index.html</title>
</head>
<body>
    <h1>WELCOME TO MY FIRST WEBSITE</h1>
    <img src="web photos/candles.jpg" alt="vin the programmer">
    <p>My name is <h2><strong>VINCENT EVERGREEN N.</strong></h2> this is my first website. I am learning HTML and web design with tutorials at <a href="http://www.ict.social">ICT.SOCIAL</a>. To know more about me, visit my <a href="contactpage.html">CONTACT PAGE</a>. Thank you, and you are highly welcome.</p>
</body>
</html>

Thanks

 
Up Reply
20. September 11:27
To maintain the quality of discussion, we only allow registered members to comment. Sign in. If you're new, Sign up, it's free.

29 messages from 29 displayed.