Solved

Can I make a page background only go once down or across the page?

Posted on 2003-11-13
10
320 Views
Last Modified: 2013-12-24
I have a framed page.
In the top frame is our logo and some text in a graphic which I have inserted in that area.
The problem is that I need some navigation buttons up there too and if I try to insert additional graphics (fancy looking buttons) I disrupt the setting of the other graphic.
I tried adding a java menu up there but it scews the image too.
I thought about putting the logo graphic as a background and then be able to add addional graphics on top of it. This might work but the logo graphic is put accross the top multiple times (as backgrounds will do if they don't quite fit)
Any thoughts on my problem and how I can fix this to do what I need?
0
Comment
Question by:rbender
  • 6
  • 4
10 Comments
 
LVL 31

Expert Comment

by:seanpowell
ID: 9738956
You can use the CSS no-repeat attribute on your background image in the top frame:

<style type="text/css">
<!--
body {background-image: url(images/bg1.gif); background-repeat: no-repeat;}
/* Setting the body tag with a background-image attribute
set to background-repeat: no-repeat; will only display the image one time
(repeat is the default setting) */
-->
</style>

Thanks,
GM
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9738966
...this is the full list:

background-repeat: repeat
The image is repeated both horizontally and vertically.

background-repeat: repeat-x
The image is repeated horizontally only.

background-repeat: repeat-y
The image is repeated vertically only.

background-repeat: no-repeat
The image is not repeated: only one copy of the image is drawn.
0
 

Author Comment

by:rbender
ID: 9739059
seanpowell
I have tried to put you code into the frame html on my page with no luck.
Not too swift with HTML ediiting.
Sorta rely on FrontPage to do most of that.
Is there a FP setting on the graphic or frame that will do the same thing?
0
VMware Disaster Recovery and Data Protection

In this expert guide, you’ll learn about the components of a Modern Data Center. You will use cases for the value-added capabilities of Veeam®, including combining backup and replication for VMware disaster recovery and using replication for data center migration.

 
LVL 31

Expert Comment

by:seanpowell
ID: 9739083
If you can post the code form the top frame, I can edit it here for you...
0
 

Author Comment

by:rbender
ID: 9739088
<html>

<head>
<script language="JavaScript1.2">
      var ace_path = '';
</script>
<script language="JavaScript" src="acemenu_loader.js">
</script>

<script language="JavaScript" src="nav_temp.js">
</script>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 3</title>
<base target="rbottom">
</head>

<body>
<script language="JavaScript">
      ACEDisplayMenu();
</script>


<script language="JavaScript">ACECreateMenu();onload=ACELoadMenu;</script>
<p><img border="0" src="RecipeiBanner.gif" width="670" height="87"></p>
</body>

</html>
0
 

Author Comment

by:rbender
ID: 9739094
Sorry...with the Background image it is:


<html>

<head>
<script language="JavaScript1.2">
      var ace_path = '';
</script>
<script language="JavaScript" src="acemenu_loader.js">
</script>

<script language="JavaScript" src="nav_temp.js">
</script>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 3</title>
<base target="rbottom">
</head>

<body background="RecipeiBanner.gif">
<script language="JavaScript">
      ACEDisplayMenu();
</script>


<script language="JavaScript">ACECreateMenu();onload=ACELoadMenu;</script>
<p>&nbsp;</p>
</body>

</html>
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9739115
In FP:

With the top frame open in Page View.

Format > Style.
Scroll to the body tag, select it, and click Modify.
On the Modify Format Dialog Box:
Click Format > Border and select the Shading Tab.
Under Patterns, browse to your logo image as the Background Picture.
Use the Repeat drop-down and select no-repeat. Click Okay.
0
 
LVL 31

Accepted Solution

by:
seanpowell earned 30 total points
ID: 9739122
So your code is now:

<html>

<head>
<script language="JavaScript1.2">
     var ace_path = '';
</script>
<script language="JavaScript" src="acemenu_loader.js">
</script>

<script language="JavaScript" src="nav_temp.js">
</script>

<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<meta name="GENERATOR" content="Microsoft FrontPage 4.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<title>New Page 3</title>
<base target="rbottom">
<style type="text/css">
<!--
body {background-image: url(RecipeiBanner.gif); background-repeat: no-repeat;}
-->
</style>
</head>

<body>
<script language="JavaScript">
     ACEDisplayMenu();
</script>


<script language="JavaScript">ACECreateMenu();onload=ACELoadMenu;</script>
<p>&nbsp;</p>
</body>

</html>
0
 

Author Comment

by:rbender
ID: 9739142
that's it..
wonderful.
Thanks
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9739149
You're welcome!
0

Featured Post

Live: Real-Time Solutions, Start Here

Receive instant 1:1 support from technology experts, using our real-time conversation and whiteboard interface. Your first 5 minutes are always free.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

When deciding to adopt any help desk solutions many factors should be explored before taking decisions. This will change from business to another but in general there are some kind of rule of thumb. Here are some quick tips: Do we need only ticket…
Now that Expression Web 4.0 (http://www.microsoft.com/expression/products/Upgrade.aspx) is free if you buy or have the full version of Expression Web 3.0, now is the best time to  migrate from FrontPage to Expression Web (http://www.frontpage-to-exp…
The purpose of this video is to demonstrate how to create a Printer Friendly PDF on a WordPress Page. This will be demonstrated using a Windows 8 PC. Tools Used are Photoshop, Awesome Screenshot” Google Chrome Extension, and SmallPDF.com Log…
The purpose of this video is to demonstrate how to insert an Iframe into WordPress. This will be demonstrated using a Windows 8 PC. Go to your WordPress login page. This will look like the following: mywebsite.com/wp-login.php : Open Page or Post…

785 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question