473,698 Members | 2,445 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

Background Positioning

Hello.

After getting great advice on positioning, I've edited my code and it's
looking more stable.

Now I need a little assistance with background image placement.

Please click on this link: www.ibtestsite.info

I've colored the background black and added a background image which is the
blue rectangular image that stretches the height of the screen (well at least
in Firefox it does). My goal is to have a centered page with no scroll bar
for up and down movement or left and right.

I've played around with body {....background-position: "whatever" px;} and
it's not doing anything.

Any advice on how to do this?
Dec 24 '07 #1
18 2605
In article <7d23aae2b99dc@ uwe>, "LayneMitch " <u39402@uwewrot e:
Hello.

After getting great advice on positioning, I've edited my code and it's
looking more stable.

Now I need a little assistance with background image placement.

Please click on this link: www.ibtestsite.info

I've colored the background black and added a background image which is the
blue rectangular image that stretches the height of the screen (well at least
in Firefox it does).
Not in my FF. 2.0.0.11 Mac The black appears at the bottom as
well as the sides.
My goal is to have a centered page with no scroll bar
for up and down movement or left and right.
That would surely be unwise? Have you got something against
people with small screens or who prefer not to use the height of
theirs?

O and by the way, have you an address for the undernourished girl
on the page? I have some nice potatoes here that I would like to
send her. I feel all motherly towards her and would like to
fatten her up for Xmas.

--
dorayme
Dec 24 '07 #2
dorayme wrote:
"LayneMitch " <u39402@uwewrot e:
>My goal is to have a centered page with no scroll bar for up and down
movement or left and right.

That would surely be unwise? Have you got something against people
with small screens or who prefer not to use the height of theirs?
Layne, look at your site with Opera and press Shift-F11.

Or with Firefox and the Web Developer Toolbar installed:
Miscellaneous Small Screen Rendering

Your page is useless, I'm afraid...

--
-bts
-Friends don't let friends drive Vista
Dec 24 '07 #3
Beauregard T. Shagnasty wrote:
>Or with Firefox and the Web Developer Toolbar installed:
Miscellaneou s Small Screen Rendering

Your page is useless, I'm afraid...

Okay....I just installed Web Developer Toolbar and hit Misc Small Screen
Rendering...

What does this mean?

How can I fix this if it matters?

--
Message posted via WebmasterKB.com
http://www.webmasterkb.com/Uwe/Forums.aspx/css/200712/1

Dec 24 '07 #4
In article <7d24dc7a4e102@ uwe>,
"LayneMitch via WebmasterKB.com " <u39402@uwewrot e:
Beauregard T. Shagnasty wrote:
Or with Firefox and the Web Developer Toolbar installed:
Miscellaneous Small Screen Rendering

Your page is useless, I'm afraid...


Okay....I just installed Web Developer Toolbar and hit Misc Small Screen
Rendering...

What does this mean?

How can I fix this if it matters?
Apart from any fancy device to help you see what other users are
seeing, you can use your own eyes and fingers. Just alter your
own browser width and use the text-size controls to see what
happens. Just remember that not everyone is seeing things at the
text and window sizes you are seeing.

--
dorayme
Dec 24 '07 #5
dorayme wrote:
>
Apart from any fancy device to help you see what other users are
seeing, you can use your own eyes and fingers. Just alter your
own browser width and use the text-size controls to see what
happens. Just remember that not everyone is seeing things at the
text and window sizes you are seeing.

Okay...

I see what you're saying.

Even though I'm new...my problem isn't with positioning...( anymore)

My problem is knowing how to properly display a background or how to display
a background image that I've designed in Photoshop. This is where advice
would greatly help.

I just experimented with resizing everything.

I got rid of all of my images and text and had just the blue rectangular
background. And I tried resizing by hitting Ctrl +... and nothing happened.
I'm thinking that this is what's effecting my entire design - the
unflexibility of my background.

Basically....ho w do you design a background graphic in photoshop and display
it properly as a background in CSS so resizing won't be a problem?

--
Message posted via WebmasterKB.com
http://www.webmasterkb.com/Uwe/Forums.aspx/css/200712/1

Dec 24 '07 #6
LayneMitch via WebmasterKB.com wrote:
Beauregard T. Shagnasty wrote:
>>Or with Firefox and the Web Developer Toolbar installed:
Miscellaneo us Small Screen Rendering

Your page is useless, I'm afraid...

Okay....I just installed Web Developer Toolbar and hit Misc Small
Screen Rendering...

What does this mean?
It means your page is useless for anyone using small-screen browsers
(mobile phones, PDAs), or where CSS is not available. People on slow
connections who disable image loading don't see anything at all.

The page also looks pretty silly on my 1680x1050 widescreen with
maximized browser window (though I personally rarely do that).
How can I fix this if it matters?
Start over? Get some content (you don't have any), properly mark it up,
then worry about design and layout last.

Try this browser, too: http://offbyone.com/

--
-bts
-Motorcycles defy gravity; cars just suck
Dec 24 '07 #7
rf

"LayneMitch via WebmasterKB.com " <u39402@uwewrot e in message
news:7d2529a6f6 e05@uwe...
My problem is knowing how to properly display a background or how to
display
a background image that I've designed in Photoshop. This is where advice
would greatly help.
A background should be exactly that, a background. Something that covers the
canvas and over which you place your content.

You don't have a background. You have a big blue box containing some
"content" (the words on that image). That "content", apart from the fact
that it should be text, and not a picture of text, should be real content,
not part of something that is assigned as a background.

As soon as you start putting your "content" in a background image you are
forced to try and position your other content in relation to that "content".
This invaribly fails.

One major reason it fails is that by default background images do not print
(to save ink) so any "content" in the background image will not print.

Another major reason it fails (in this case) is that the google bot does not
read "content" in images. That "content" is invisible to google.
By the way the picture of the pretty girl is way too big. If you use some
proper image manipulation software you could compress it from the 163K it is
now down to something like 20K. Same with the other images. The entire page
is almost 300K. Way too big for what it is.

Oh, and *don't* use letter-spacing to space those two mirror images.

--
Richard.
Dec 24 '07 #8
LayneMitch via WebmasterKB.com wrote:
And I tried resizing by hitting Ctrl +... and nothing happened.
Nothing happened because you have no text, only images. (I assume the
Ctrl+ was in Firefox; that just resizes text.)

--
-bts
-Motorcycles defy gravity; cars just suck
Dec 24 '07 #9
rf wrote:
>You don't have a background. You have a big blue box containing some
"content" (the words on that image). That "content", apart from the fact
that it should be text, and not a picture of text, should be real content,
not part of something that is assigned as a background.
So what would be the best method to produce a blue box and have it a part of
a background? Should I even specify it as an image?
>By the way the picture of the pretty girl is way too big. If you use some
proper image manipulation software you could compress it from the 163K it is
now down to something like 20K. Same with the other images. The entire page
is almost 300K. Way too big for what it is.
Still working on the optimization.
>Oh, and *don't* use letter-spacing to space those two mirror images.
Understood...ju st thought it would be witty.

--
Message posted via WebmasterKB.com
http://www.webmasterkb.com/Uwe/Forums.aspx/css/200712/1

Dec 24 '07 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

6
4939
by: Michael Rozdoba | last post by:
I've had some trouble getting IE to behave in respect of applying absolute positioning to a span on an a:hover. I can get it to work, but I don't understand why certain code causes it to fail to display the repositioned block. See an example at http://www.digitalrat.co.uk/test2/index.html Can anyone explain what IE thinks it's doing? The page is ugly as I've ripped most of the content & styling out to
8
5039
by: Serge Hartmann | last post by:
hi there, I created two different backgrounds for the same page to obtain a (fake) left margin and a (true) right margin. -> left background, defined in body section, aligned bottom and with vertical repeat. -> right background, defined in html section, aligned top and without repeat it may look weird, but I don't think my problem is due to these margins.
8
1988
by: johkar | last post by:
I have two problems I cannot work out in the following tab code with Netscape 6. Problems are marked with all cap comments. One is that the background image is not shown in NS 6 (two places in CSS). The second problem is that the top right rounded corner is not showing up in the Tier 2 tabs. Could you have a look and tell me if it is possible to correct? This code seems to work fine in IE 5+ and Firefox. Note that since I can't post...
3
1904
by: andrew | last post by:
Hi there, I've fought with this problem before in IE and "solved" it by setting various block elements to have 100% width, but now that won't work for me and I'm just curious in general as to what the heck IE is doing here. If you visit the page at http://iceman.redlinesoftware.com/test.html in IE, the background for the text "sections" to the right should be yellow, but they won't be when you first view the page; you first have to...
3
3236
by: Viken Karaguesian | last post by:
Hello all, I need somehelp with background tiling. I have a sneaking suspicion that what I want to do is not possible, but I'll ask anyway. :>) First some background: Here's the site in question: www.sayatnova.com (I'm sure many of you have seen this before as I've often asked for help). I've come a long way since I first created the site many moons ago and I'm trying to convert it to a (1) Table-less, (2) Frame-less and (3) Validated...
16
14626
by: Walker | last post by:
I have a span containing two words. Eg. <span>Avant Garde</span> Using CSS, I pad the text to the right and assign a background-image. Eg. span { padding: 0 3px 0 11px; background: url(images/tagbull.gif) no-repeat 0px 2px; }
3
5668
by: seamlyne | last post by:
The first method I ever used for multiple state buttons was to create a graphic for each button for each state: AboutUs_on, AbooutUs_over, AboutUs_out, etc. That works great when there are just a few buttons. I'm creating interfaces now with many more buttons than "just a few". I solved the maintenance problem by having generic button images, one for each state, and having them be background images for text containers, DIVs in this...
16
4930
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...
10
5754
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. ...
0
8675
marktang
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...
0
8604
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,...
1
8897
by: Hystou | last post by:
Overview: Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
0
7729
agi2029
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...
1
6521
isladogs
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...
0
4370
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
1
3050
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
2
2331
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.
3
2002
bsmnconsultancy
by: bsmnconsultancy | last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.