/    Sign up×
Community /Pin to ProfileBookmark

Prob With Dividing up my Page!

Hi, I really need to make a vertical third of my web page into a menu, separate from the rest of that page. I don’t want it to have a scroll bar but instead to use the change of graphics to define where the menu separates from the rest of the page.
Any help would be much appreciated.

Kind Regards,
Sean Harte Barry.

to post a comment
HTML

1 Comments(s)

Copy linkTweet thisAlerts:
@the_treeOct 20.2005 — Easy, just split it into two dividers (<div>) then float them against each other.[code=html]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Page Title</title>
<style type="text/css">
<!--
body{
padding: 0;
margin: 0;
}
div#alpha,div#beta{
margin: 0;
float: left;
}
div#alpha{background-color: #fcc; width: 70%;}
div#beta{background-color: #cfc; width: 30%;}
-->
</style>
</head>
<body>
<div id="alpha">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Nam ut ipsum. Nunc et quam. Nunc vestibulum suscipit lorem. Ut posuere, justo at fermentum tempus, massa eros tempor tortor, nec varius diam metus et arcu. Donec orci metus, porttitor accumsan, euismod id, consectetuer ut, risus. Phasellus bibendum porta velit. Nulla leo. Integer rutrum vestibulum mi. Phasellus gravida venenatis enim. Maecenas nisl. Nulla et pede vitae diam sagittis pulvinar. Praesent imperdiet imperdiet metus. Curabitur nisl metus, sagittis non, elementum eget, pellentesque at, neque. Sed sit amet sapien sed nunc vestibulum facilisis. Nullam eros nulla, dapibus eget, sagittis nec, euismod vel, justo. Sed vestibulum quam id pede. Curabitur porttitor convallis massa. Proin dolor.</p>
<p>Maecenas turpis. Aenean erat. Curabitur consequat convallis diam. Aliquam placerat. In vel mauris. Nunc tristique enim ut massa. Curabitur ac nibh. Aliquam non pede. Vestibulum massa. Vivamus euismod tortor a lorem. Aliquam vel quam id quam faucibus consequat. Vivamus aliquet quam eleifend mi. Maecenas adipiscing eleifend odio. Phasellus est leo, lacinia sed, euismod at, venenatis placerat, nibh.</p>
</div>
<div id="beta">
<p>Mauris ornare leo vitae orci. Proin consequat neque ac ligula. Etiam et leo. Donec tincidunt, magna ac volutpat aliquam, eros tortor fringilla sem, ac consequat urna neque vitae dui. Duis semper scelerisque enim. Vivamus nec arcu in mauris posuere facilisis. Etiam in lorem at nulla consectetuer tempus. In in purus. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos. In hac habitasse platea dictumst. Nulla facilisi. Vivamus nonummy sem sed neque. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In vitae libero eu orci fringilla aliquet. Mauris faucibus semper lectus.</p>
</div>
</body>
</html>[/code]
×

Success!

Help @seh1 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.28,
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,
)...