Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chriss Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

How to create Frames using cascading stylesheets? 1

Status
Not open for further replies.
fmasin

fmasin

Technical User
May 3, 2002
163
GB
Hi,

How can I create Frames for my website using cascading style sheets? I need a little Frame on the left-hand side to contain links to other pages...and also one at the top to put a company logo and other links....and I would like the same structure to run through the entire web.

Some good soul out there....help.

Thanks and regards,

Francis
 
Sort by date Sort by votes
Hi ChrisHirst,

Many thanks for the link....I found it extremely useful...
However, how can you get a menu that branches off into other smaller menus....say for example, you could have your main menu item as Products....and when you hover over it, it opens other sub menus, as Beans, eggs, books, cars etc.





Thanks and regards,

Francis
 
Upvote 0 Downvote
Upvote 0 Downvote
Many thanks Chris,

I have now created my style sheet and saved it with a .CSS extension.

Now I have got about 5 pages. How can I now apply my style sheet to be reflected on all pages. I have tried but it's not calling it up.
Do I simply put a link at the beginning of every page and how exactly should I include that link?

Thanks and regards,

Francis
 
Upvote 0 Downvote
use
Code: 
<link href="/include/style.css" rel="stylesheet" type="text/css">

in the document head. Obviously changing the path and filename to suit.



Chris.

Indifference will be the downfall of mankind, but who cares?
 
Upvote 0 Downvote
Chris,

I seem to be getting errors.....

Below is my style sheet that I have named videlib.css


<style type="text/css">

body {margin:0; padding:0 10px 0 10px; border:0; height:100%; overflow-y:auto; background:rgb(123,187,221);}
body {font-family: georgia, serif; font-size:16px;}
#pageshadow {margin:310px 0 50px 260px; display:block; width:500px; height:1000px; border:1px solid #aaa; background:#888; padding:10px;}
#page {margin:-1085px 0 50px 150px; display:block; width:720px; height:1000px; border:1px solid #000; background:#fff; padding:10px;}
#page .right {font-size:30px; float:right;}
#menu {display:block; top:10px; left:30px; width:130px; position:fixed; border:1px solid #888; padding:10px; text-align:center; font-weight:bold; color:#fff; background:url(grid2.gif);}
* html #menu {position:absolute;}
#menu a:visited, #menu a {display:block; width:120px; height:20px; margin:0 auto; border-top:1px solid #fff; border-bottom:1px solid #000; text-align:center; text-decoration:none; line-height:20px; color:#000;}
#menu a:hover {background:#aaa; color:#fff;}
.clear {clear:both;}
p:first-letter {font-size:25px; color:#d88;}

</style>
<!--[if IE 6]>
<style type="text/css">
/*<![CDATA[*/
html {overflow-x:auto; overflow-y:hidden;}
/*]]>*/
</style>
<![endif]-->
</head>


<div id="pageshadow"></div>
<div id="page">
<div class="left"></div>
<div class="clear"></div>

<div class="right">WELCOME TO VIDELIB RENTAL LIBRARY</div>
<div class="clear"></div>

<div id="menu">
VIDELIB MENU
<a href="Index.asp" title="Home">Home</a>
<a href="ViewMovies.asp" title="Movies">Movies</a>
<a href="ViewGames.asp" title="Games">Games</a>
<a href="RentalEntry.asp" title="Rent Now">Rent Now</a>
<a href="EditOwn.asp" title="Edit Own Details">Edit Own Details</a>
<a href="MemberEntry.asp" title="Members">Registration</a>
<a href="Links.asp" title="Links">Links</a>
<a href="Comments.asp" title="Comments">Comments</a>
</div>
<body>


And below is how I call it up in one of the pages:

<%@ LANGUAGE="VBSCRIPT" %>
<!--#include file="connect.asp" -->
<!--#include file="log.asp" -->
<html>
<head>
<link href="videlib.css" rel="stylesheet" type="text/css">
<title>Member Login</title>

</head>
<body>
<h1>Member Login</h1>
<form method="POST" action="UserAuthenticate.asp">
<table border="1" cellpadding="2" cellspacing="2" style="border-collapse: collapse" id="AutoNumber2">
<tr>
<td>Name</td>
<td><input name="Name" size="12"></td>
</tr>
<tr>
<td>Password</td>
<td><input type = "password" name="Password" size="12"></td>
</tr>
</table>
<br />

<input type="submit" value="Submit" name="B1"><br \>
</form>
</body>
</html>

Now ...it's not working.....It only works when I add the actual style sheet code on every page....but when I save it and call it up as a link to the style sheet...nothing happens...please help.

Thanks and regards,

Francis
 
Upvote 0 Downvote
if your style sheet is as you posted above you will need to clean it up quite a lot.
Style sheets should not have;

HTML code in them,
<style> tags,
any programming code.

only styles and their attributes should be in there, any "hacks" you are using will belong in the head of each document.




Chris.

Indifference will be the downfall of mankind, but who cares?
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

leifoet
  • Locked
  • Question
How to send HTML emails with ASP classic?
Replies
0
Views
759
leifoet
leifoet
leifoet
  • Locked
  • Question
How to check if a datatable is empty ?
Replies
0
Views
543
leifoet
leifoet
penguinspeaks
  • Locked
  • Question
Return to current location on page after asp processes.
Replies
2
Views
663
penguinspeaks
penguinspeaks
bslintx2021
  • Locked
  • Question
How to configure IIS 10 server to allow Classic ASP to connect to MSSQL server database on a domain
Replies
1
Views
1K
penguinspeaks
penguinspeaks
Swi
  • Locked
  • Question
JQUERY AJAX POST and how to receive data via Classic ASP
Replies
0
Views
822
Swi
Swi

Part and Inventory Search

Sponsor

Back
Top