[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
?
Solved

setting an image as a background and putting it on the center of the web page?

Posted on 2006-05-17
7
Medium Priority
?
144 Views
Last Modified: 2010-04-09
Hi,

I am trying to create webpage where I just have an image which should be on the background. It should be in the center of the page and below that image I want to say we are coming soon.

It is possible. I want to do it thru div tag.

Thanx in advance,

slick
0
Comment
Question by:slickdeals
7 Comments
 
LVL 49

Expert Comment

by:Roonaan
ID: 16702184
<div style="background:url(image.jpg) no-repeat 50% 50%;">
</div>

-r-
0
 
LVL 16

Expert Comment

by:ThinkPaper
ID: 16702244
another method:

<STYLE type="text/css">
 <!--
 BODY { background-image:url(background.gif);
               background-repeat:no-repeat;
               background-position:center center;
               background-attachment:fixed }
 -->
</STYLE>
0
 

Author Comment

by:slickdeals
ID: 16705756
roonaan the div tag did not work.


ThinkPaper the style of the body works but then how do I control the size of the image.

Thanx in advance.
0
What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

 
LVL 49

Expert Comment

by:Roonaan
ID: 16705824
slickdeals, Have you added content to the div, or set a height to it?

-r-
0
 

Author Comment

by:slickdeals
ID: 16709069
nope I am novice in HTML can u quote me with an example. That will be a great help.
0
 
LVL 49

Accepted Solution

by:
Roonaan earned 375 total points
ID: 16709190
Please have a go with this one:

<div style="background:url(image.jpg) no-repeat 50% 50%;height:500px;width:500px;">
</div>

Kind regards

-r-
0
 
LVL 4

Expert Comment

by:Jeremy Daley
ID: 16748538
you could just place something like a "non-breaking space" to the <div> or even a 1x1 transparent gif.

non-breaking space = <div>&nbsp;</div>

the <div> won't expand to its specified css dimensions if nothing is contained within it.
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

Question has a verified solution.

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

When it comes to write a Context Sensitive Help (an online help that is obtained from a specific point in state of software to provide help with that state) ,  first we need to make the file that contains all topics, which are given exclusive IDs. …
Without even knowing it, most of us are using web applications on a daily basis.  In fact, Gmail and Yahoo email, Twitter, Facebook, and eBay are used by most of us daily—and they are web applications. We generally confuse these web applications to…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

834 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