The client wants the page to have both a left border (purple) and a right
border (green).
Is there any way to stretch a background image to fit the viewport? Or
should I divide
the background into columns, each a different color?
Mary Ellen
Doctor Science, MA 7 14570
Brian wrote: body { border-left: thin solid #909 ; border-right: thin solid #090 ; }
I was unclear. By "border" I meant the sort of border+backgrou nd you see
here: http://www.pambytes.com/borders/paper/index1.html
(example chosen by random googling). The client wants quite a wide colored
band
running down each side of the viewport.
Erm, why would you use an image for borders?
Because they want something wide (and later I suspect they will want
textures, etc.). Also,
IE5.5 (at least) puts a body border (as in your example) outside the scroll
bar.
While googling I found this example: http://www.bigbaer.com/css_tutorials...css.template.h
tm
and am looking at the code in the hopes I can alter it to be useful.
Mary Ellen
Doctor Science, MA
Replying to myself, I've put *something* together here: http://www.alternateuniverses.com/test/anetry.html
Do I need to use a box hack on my "main" division to get it to go up to the
top of the screen
in IE6.0? It looks just right in IE5.5.
Mary Ellen
Doctor Science, MA
Mary Ellen Curtin wrote: Brian wrote:
body { border-left: thin solid #909 ; border-right: thin solid #090 ; } I was unclear. By "border" I meant the sort of border+backgrou nd you see here: http://www.pambytes.com/borders/paper/index1.html
Nothing happens. "Operation timed out..." Server problems? Erm, why would you use an image for borders?
Because they want something wide
body {
border-left: 10px solid #909 ;
border-right: 10px solid #090 ;
}
(and later I suspect they will want textures, etc.).
Textured, you say? I suppose images could be used for that. You can
use a background image, 1 pixel high, and use repeat-vertical to have
it run down the page. But you can only have 1 background image for
any given element. You'll have to patch something together for the
other border.
Also, IE5.5 (at least) puts a body border (as in your example) outside the scroll bar.
Have you tried putting a div inside the body, and applying the borders
to the div? You'd have to set height: 100%; mind, I haven't tested
that idea.
--
Brian
follow the directions in my address to email me
Mary Ellen Curtin wrote: http://www.alternateuniverses.com/test/anetry.html
Do I need to use a box hack on my "main" division to get it to go up to the top of the screen in IE6.0? It looks just right in IE5.5
There is a margin-top to the h1. Is that the problem? If not, please
elaborate.
Mary Ellen Doctor Science, MA
Would you consider fixing your sig? Put "-- " (note the space) on a
line by itself, then put your sig below it. Proper sig delimiters
make replying easier.
--
Brian
follow the directions in my address to email me
Mary Ellen Curtin wrote:
| The client wants the page to have both a left border (purple) and a right
| border (green).
| Is there any way to stretch a background image to fit the viewport? Or
| should I divide
| the background into columns, each a different color?
Hi Mary, an easy solution could be this if you have to use
graphics borders. CSS part:
<style type="text/css">
html, html>body{
height: 100%;
/*just added for testing purpose even with blank page in
Opera and Mozilla, remove it when you've filled up the page*/
}
body{
background: url("leftborder .gif") top left repeat-y
}
div#main{
background: url("rightborde r.gif") top right repeat-y;
margin: 0 100px;
}
</style>
and in the html:
<body>
<div id="main">
<!-- put all content here -->
</div>
</body>
Note the right and left margin should have at least same width
of the background images.
HTH,
SantaKlauss
Hi Mary,
just a little thing to add: if you want the body background-color to
be set, and I suppose you would, just have to add the color in the body
background shorthand and leave the main content with transparent
background, like this:
body{
background: #69C url("leftborder .gif") top left repeat-y
}
div#main{
background: transparent url("rightborde r.gif") top right repeat-y;
margin: 0 100px
}
HTH,
SantaKlauss
Ooops, sorry: have to use padding instead of margin.
body{
background: #69C url("leftborder .gif") top left repeat-y
}
div#main{
background: transparent url("rightborde r.gif") top right repeat-y;
padding: 0 100px
}
*<|:-)
SantaKlauss This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics |
by: CMAR |
last post by:
I have a design of a frameless page on my practice website:
http://home.ne.rr.com/thespar/designerN.htm
The idea is to have a #left navigation bar which is absolutely positioned
and which contains a series of vertical placed unordered lists of links. To
the right of the #left navigation bar is the #content section. I want the
background in the #left section to extend to the bottom of the browser
window.
|
by: Konrad Den Ende |
last post by:
I have a function returning a string but the problem is that the
color of it is blue which suits me well for some pages but not for
others. Is it possible to "feel" what the color of the background
in the current document is and set the color of the output accordingly? The
background will be an image, in most cases.
--
Kindly
Konrad
|
by: Skeeve |
last post by:
Hi there,
I'm trying to create a containing box (relative position), and within
it, I'm trying to line that box with four (top, right, left, bottom)
thin boxes that contain a repeated background image, thus creating a
kind of fancy border. What would be the best practice to do that? I
thought that if the containor box was relative and the contained boxes
were absolute, that would work because the absolute boxes would be
measured...
|
by: Skeeve |
last post by:
Hi there,
I'm trying to create a containing box (relative position), and within
it, I'm trying to line that box with four (top, right, left, bottom)
thin boxes that contain a repeated background image, thus creating a
kind of fancy border. What would be the best practice to do that? I
thought that if the containor box was relative and the contained boxes
were absolute, that would work because the absolute boxes would be
measured...
|
by: arteccentrix |
last post by:
Please bear with me as I am new to both Firefox and CSS. I have browsed
through a number of groups looking for similar problems to my own but
can't find a definitive answer. If anyone here can help me out I would
appreciate your shared expertise so much.
My background image is displaying fine in IE, and, sometimes in Firefox
until I hit the reload button. It seems as if the browser is unable to
locate the image and throws up a graphic...
| |
by: Philipp Kraus |
last post by:
Hi,
I have one problem with my position of my background image. I have
created one div-tag that has a background image, which should be fixed
during scrolling. On the left side of the div is my menu-div, so the
content div is shown round 25% from the left browser side. In this
content div I would like to position a image on the left or right side.
I need a background-attachment: static, because the layout position is
the div, not the...
|
by: mdejac |
last post by:
I was wondering why the background color is not showing up in Mozilla. When I view the page there is a light blue background, when it should be black. Thank you for any help. http://www.myspace.com/mdejac
<style type="text/css">
body {
font-family: helvetica, arial, sans-serif;
font-size: 62.5%;
background-color: black;
}
table, td {
|
by: stevedude |
last post by:
CSS newbie again. I have a problem trying to get coffee mug images
within anchor tags to center with my link text for a vertical list
menu. If I use the horizontal/vertical properties of "background" or
"background-image", the positioning only works with specifying
pixels.
If I specify the vertical position in pixels, the image gets cut-off
at the bottom. I don't know what to do and would appreciate anyone's
help. Specifically the code...
|
by: VividWeb |
last post by:
Hi.
I am relatively new to CSS and HTML but have a basic understanding of most things.
One of my backgrounds is not positioning correctly in IE 7 or AOL. The background behind the content (small chocolate area) is positioning slightly down the page instead of at the top. I have used the same techniques in the navigation and it positions fine. Its fine in Fire Fox Opera & Safari. I have run my HTML & CSS through W3c and all is clean.
...
|
by: ton |
last post by:
Hi,
I have an Image which is dark grey/black, at the top a white line, at the
left site a white line as well.
At 192 px from the left of the screen I position a DIV with this image as
the background image. In the code I've added a multi line textbox (in my
real world it is a treeview). It is placed that I would have to scroll to
see the entire textbox. What happens is that the image will repeat itself,
this is what you expect. Because...
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look !
Part I. Meaning of...
| |
by: Hystou |
last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it.
First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
|
by: tracyyun |
last post by:
Dear forum friends,
With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
|
by: agi2029 |
last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own....
Now, this would greatly impact the work of software developers. The idea...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
| |
by: 6302768590 |
last post by:
Hai team
i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated we have to send another system
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |