/    Sign up×
Community /Pin to ProfileBookmark

HTML and Frames

Hello, I was wondering if you could help me with a problem ive been having with frames. Is there anyway i can make it so i have my main page Welcome, and add the navbar in a frame onto the left of it?.

N| I
A| N
V| D
B| E
A| X
R|

Like above

i tried
<HTML>
<TITLE>FRAME Page 2</TITLE>

<FRAMESET COLS=”200,80%”>
<FRAME SRC=”welcome.html” noresize=”yes”>
<FRAME SRC=”welcome2.html” noresize=”yes”>
</FRAMESET>

</HTML>

but i have to create a whole new page with nothing on and put that code in when i want it o have the welcome info aswell with the navebar attached.

to post a comment
HTML

1 Comments(s)

Copy linkTweet thisAlerts:
@kaitcoJun 11.2006 — If I understand you properly, you want your navigation as one frame to the left of your main content:

[CODE]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html>
<title>Page Title</title>
<frameset cols="[B]25%,75%[/B]">

<frame src="nav.html">
<frame src="content.html">

</frameset>
</html>[/CODE]


You can change the sizes to fit what you need.

However, frames is no longer a convenient way of coding a page. It would be better to just use div and CSS, that way you will not have to worry about visitors to your pages who will cannot view frames.

[CODE]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<html>
<title>Page Title</title>

<style type="text/css">
#container {width: 100%;}
#nav {width: 15%; float: left; padding: 0em; margin: 0em;}
#content {width: 80%;}
ul {list-style-type: none; margin: 0em; padding: 0em;}
</style>

</head>

<body>

<div id="container">

<div id="nav">
<ul>
<li>Navbar text</li>
<li>Navbar text</li>
<li>Navbar text</li>
<li>Navbar text</li>
<li>Navbar text</li>
<li>Navbar text</li>
</ul>
</div>

<div id="content">
<p>This is your content</p>
<br />
<p>You can put all that would have gone in your second page right here</p>
</div>

</div>
</body>

</html>[/CODE]
×

Success!

Help @Draknacovik spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.18,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...