Size and rotate a background image

I would like to have a background image that rotates different images when the page is refreshed and sizes with my page. I believe I have a handle on the sizing part but I can't figure out how to make the images rotate. I would like the images to go in a particular order instead of random if that's possible.
This is what I have so far:
<head>
<title>Stretched Background Image</title>
<style type="text/css">
/* Remove margins from the 'html' and 'body' tags, and ensure the page takes up full screen height */
html, body {height:100%; margin:0; padding:0;}
/* Set the position and dimensions of the background image. */
#page-background {position:fixed; top:0; left:0; width:100%;;}
/* Specify the position and layering for the content that needs to appear in front of the background image. Must have a higher z-index value than the background image. Also add some padding to compensate for removing the margin from the 'html' and 'body' tags. */
#navbar {position:relative; z-index:1; padding:10px;}
#content {position:relative; z-index:2; padding:10px;}
</style>
<!-- The above code doesn't work in Internet Explorer 6. To address this, we use a conditional comment to specify an alternative style sheet for IE 6 -->
<!--[if IE 6]>
<style type="text/css">
html {overflow-y:hidden;}
body {overflow-y:auto;}
#page-background {position:absolute; z-index:-1;}
#content {position:static;padding:10px;}
</style>
<![endif]-->
</head>
<body>
<div id="page-background"><img src="stretchPix2.jpg" width="100%" alt="Smile"></div>
<div id="navbar">
<h2><img src="TestNavArt.gif" width="900" height="30"></h2>
</div>
<div id="content"><font color="#FFFFFF"> more test here?</font></div>
</body>
</html>
If anyone can give me some insight into making the background image rotate I would greatly appreciate it.
Thanks,
Dave

Hi
The only reliable way to rotate a background image is using css3 but as this feature is only implemented in 1 browser, (and that is in beta)? There are a few javascript frameworks that claim to do this, but in testing I have not found one that is even 50% reliable.
PZ

Similar Messages

  • Scale and rotate a tiff image

    How do you scale and rotate a tiff image without running out of memory?
    I have been trying to scale the image and rotate it before i pass it to the DisplayJAI but i keep running out of memory.
    code i use to rotate the image.
    private Image rotateImage(boolean rotateRight)
    Image img = imageHolder.getInUseImageIcon().getImage();
    Image rot = null;
    int imageWidth = imageHolder.getInUseImageIcon().getIconWidth();
    int imageHeight = imageHolder.getInUseImageIcon().getIconHeight();
    int buffer[] = new int[imageWidth * imageHeight];
    int rotate[] = new int[imageWidth * imageHeight];
    try
    MediaTracker tracker = new MediaTracker (this);
    tracker.addImage (img, 0);
    tracker.waitForAll();
    PixelGrabber grabber = new PixelGrabber(img, 0, 0, imageWidth, imageHeight, buffer, 0, imageWidth);
    try {
    grabber.grabPixels();
    catch(InterruptedException e) {
    e.printStackTrace();
    if(rotateRight)
    for(int x = 0; x < imageWidth; x++)
    for(int y = 0; y < imageHeight; y++)
    rotate[(x*imageHeight)+y] = buffer[((imageHeight-y-1)*imageWidth)+x];
    else
    for(int y = 0; y < imageHeight; y++)
    for(int x = 0; x < imageWidth; x++)
    buffer[(y*imageWidth)+x] = rotate[((imageWidth-x-1)*imageHeight)+y];
    for(int y = 0; y < imageHeight; y++)
    for(int x = 0; x < imageWidth; x++)
    rotate[((imageWidth-x-1)*imageHeight)+y] = buffer[(y*imageWidth)+x];
    rot = createImage(new MemoryImageSource(imageHeight, imageWidth, rotate, 0, imageHeight));
    catch (Exception e)
    e.printStackTrace();
    return rot;
    this is the code i use to scaled the image.
    Image scaled = originalImage.getImage().getScaledInstance(
    (int)(currentWidth * 1.5),
    (int)(currentHeight * 1.5),
    Image.SCALE_FAST);
    I tried this method, it works and does what i want but the scrolling and loading is too slow.
    public void paintComponent(Graphics g)
    Graphics2D g2D = (Graphics2D)g;
    g2D.rotate(Math.PI/2, (int)dimension.getWidth()/2, (int)dimension.getHeight()/2);
    g2D.drawImage(image, 0,0,(int)dimension.getWidth(), (int)dimension.getHeight(), this);
    Help plss.

    Nvm got the answer :)

  • Can we resize and change the background image in a 2 page layout?

    I am a two page layout report in RTF. Can I use different background image on page 1 and page 2? The first page background will not be repeated but the second page will. Also, it seems when we insert a background image by going "Format -> Background -> Fill effect -> Picture", after we finished the whole process we can't get the background image to fit with the page, can we resize it to be fit with the page? Thanks for your help!

    Yes.  Select the image and go to the Inspector/Hyperlink/Link pane and use the Link to One of my Pages option.
    Remember: the photo must be added to the page by dragging it onto the page and then be selected.  It can't be added as a background image with the Inspector/Page/Layout pane.
    OT

  • Flip and rotation on an Image

    Hello,
    I would like to perform flip and +/-90� rotation on an image but after a rotation, the flip is performed in the wrong direction my code looks like this :
    /*axis at the center of image*/
    g2D.translate(width/2,height/2);
    g2D.scale(-1,1);
    g2D.rotate(Math.PI);
    /*image orientation correction*/   
    g2D.scale(1,-1);
    /*rotation and flip*/     
    g2D.rotate(flipHorizontal*flipVectical*Math.toRadians(angle));
    g2D.scale(flipHorizontal,flipVectical); //1 or -1
    /* drawing the image */   
    g2D.drawImage(imageToDraw, centreToX,centreToY, null);
    // than positioning the axis back to origine I've tried to say that if the image as already been rotated then invert the flips, but in that case, after one flip the rotation is performed in the wrong direction...
    Does anybody know how to solve this problem???
    Thank you in advance.

    i have to rotate, flip & scale an image , but it get misplaced when rotated on 90 and -90 please help me public void putImage_buffer(String s,int x,int y,int width,int height,double rotation,int xScale,int yScale,boolean hFlip,boolean vFlip) {
              int Rwidth=width;
              int Rheight=height;
                    try{
    ImageInputStream imageInput = ImageIO.createImageInputStream(new FileInputStream(filename));
                it = ImageIO.getImageReaders(imageInput);
                reader = (ImageReader) it.next();
                reader.setInput(imageInput);
                objBufimage=reader.read(0);
    }catch(Exception e){System.out.println(e);}
              System.out.println("width : height! ratation"+width+" : "+height+"  : "+rotation);
            if(width==0&&height==0){
                offscreen.drawImage(objBufimage,0,0, null);      
             else{
                   if(!(vFlip||hFlip)){
                        if(rotation==90)
                             Rwidth=height;
                             Rheight=width;
                             System.out.println("!(vFlip||hFlip) 90");
                        if(rotation==-90 )
                             rotation=270;
                             System.out.println(" -90 !(vFlip||hFlip");
                             Rwidth=height;
                             Rheight=width;
                   if(vFlip )
                        if(rotation==90)
                             hFlip=!hFlip;
                             vFlip=!vFlip;
                             //Rwidth=height;
                             //Rheight=width;
                             System.out.println("width : height 90 vFlip");
                        if(rotation==-90)
                             hFlip=!hFlip;
                             vFlip=!vFlip;
                             //Rwidth=height;
                             //Rheight=width;
                             rotation = 270;
                             System.out.println("width : height -90 vFlip");
                        if(rotation==180)
                             System.out.println("width : height 180 vFlip");
                   else if(hFlip )
                        if(rotation==90)
                             hFlip=!hFlip;
                             vFlip=!vFlip;
                             System.out.println("width : height 90 hFlip");
                             //Rwidth=height;
                             //Rheight=width;
                        if(rotation==-90)
                        {     rotation=270;
                             hFlip=!hFlip;
                             vFlip=!vFlip;
                             Rwidth=height;
                             Rheight=width;
                        if(rotation==180)
                             System.out.println("width : height 180 hFlip");
                   if(vFlip && hFlip)
                        if(rotation==90)
                             System.out.println("width : height 180 hFlip&&vFlip 90");
                        if(rotation==-90)
                             rotation=270;
                             System.out.println("width : height 180 hFlip&&vFlip -90");
                AffineTransform tx = new AffineTransform();
                AffineTransform origTransform = offscreen.getTransform();
                   System.out.println("hFlip:vFlip Math.PI "+hFlip+" : "+vFlip);
                   rotation=rotation*(hFlip?-1:1)*(vFlip?-1:1);
                   rotation = Math.toRadians( rotation );
                   AffineTransform rotate=AffineTransform.getRotateInstance(rotation, Rwidth/2d, Rheight/2d);
                   AffineTransform moveToImageCenter=AffineTransform.getTranslateInstance(Rwidth/2d, Rheight/2d);
                   moveToImageCenter.concatenate(AffineTransform.getScaleInstance(hFlip?-1:1,vFlip?-1:1));
                   moveToImageCenter.concatenate(AffineTransform.getTranslateInstance(Rwidth/-2d, Rheight/-2d));
                   AffineTransform flip=moveToImageCenter;
                   AffineTransform transformer = AffineTransform.getTranslateInstance(x,y);
                   offscreen.setTransform(transformer);
                                  offscreen.transform(rotate);
                   offscreen.transform(flip);
                   offscreen.drawImage(objBufimage,0,0,Rheight,Rwidth,null);
                   //offscreen.drawImage(objBufimage.getScaledInstance(width,height,objBufimage.SCALE_DEFAULT),0,0,width,height, null);
                   offscreen.setTransform( origTransform );
         }i get vFlip if hFlip+90or-90 and i get hFlip if vflip +90-90 means if actual flipping is vflip+90/-90 my method parameter gets hFlip +/-90 thats by i'm changing values

  • How can I animate size and rotation on mouse over?

    Hello,
    I'm fairly new to Edge Animate and have been trying to find tutorials but all I've found so far are ones for older versions which are very different to the new CC 2014 versions so not had much luck..
    I'd like to animate icons similar to the those on the coloured band on this site: http://do.live147.com/html/rockox/index.html  ("Website", Latest Trends" etc..)
    So on mouse over I'd like to animate the scale and rotation of the icon, and then if possible, to keep it in that new state until another icon is selected (rather than returning on mouse out).  All icons are for a design in Muse (CC 2014).
    Can anyone help me or point me towards some new tutorials which covers this?  I'd appreciate any clues on how to do this!
    I'm using Edge Animate CC 2014.1 on a Mac.
    Thanks in advance!
    Anne-Marie

    Ooh okay - thanks Heathrowe - I see what you mean about using the symbols to group animations, does seem much simpler!
    So, putting the question back out there...
    I've managed to implement the mouse rollover states;
    mouseenter:      sym.getSymbol("Concept").play('Over');
    mouseleave:      sym.getSymbol("Concept").playReverse();
    When each one is clicked, it holds;
    click:  sym.getSymbol("Concept").play('Click');
    Now I need to figure out the code to make each symbol continue to hold after it's been clicked on (even if the mouse rolls over them again), and playReverse ONLY when another symbol is clicked.  My plan is to have information appear under this banner which changes depending on which tab is selected.
    Here's my project if it helps to see...  http://we.tl/u8r6sZNvdA
    Any help would be hugely appreciated!!
    Thanks

  • Selecting and deselecting desktop background images

    Can I select which Apple photos to use when setting desktop background to Change Picture? Put another way, can I deselect pictures I don't want to see? I hoped the "-" box at the bottom of the list would let me deselect folders or even specific images within folders, but it doesn't. I would like to have only the nature pictures in the Change Picture rotation.

    You would have to create your own folder or album with select photos for this type control.
    Use the + sign to add your album.

  • Page Size and Rotated printing Bug

    When using the DataMax I4208 printer, I cannot use Crystal Reports 2008 as it will autorotate the text 90 degrees as it sees fit to the label.  It is always wrong which causes the font size to be reduced to a super fine font too small for a microscope.  If I change the page size from 4.00 x 1.00 to 4.00 x 4.00 it does not rotate it, it just spits out 3 blank labels with the one correct one.  I cannot find another way to get Crystal Reports to do wysiwyg.

    Hi Pat,
    Fix Pack 2.3 was just released also and there are more updates to fix printer issues in there also.
    A few other things to check is in the report check off Dissociate Formatting Page... this could be one of you issues. Also, use the latest printer driver. CR is unicode compliant and print drivers nust be aware of this also.
    Thank you
    Don

  • Finally got bullets to work, and now my background images are jacked?

    This has been frustrating me all freakin' day.  I was having the worst time trying to get my bullets to work correctly, and finally assigned a div in my external CSS, and then they finally decided to work.  But now, which I believe to be some sort of padding issue, some of my background and border images are just WAAYY off like in the attached picture.
    Any help with the code would be greatly appreciated, as I am still learning, and Ive managed to take a template and make it look halfway decent (from the visual side of things - Im sure the code is a complete mess).
    http://pastebin.com/Jeqkfbvb - My CSS
    http://pastebin.com/bP8w0vKj - My intro page
    The bottom of the intro page looks like that when it should be flush.  I cant figure out what I jacked to fix it and I cant figure out why the bullet points/new div would even affect it in that way.
    Halp

    I figured it out through trial and error.
    I had not closed some div tags and they were causing my footer to be way above where it should be.
    Sorry to waste peoples time

  • How to make image stay still in background while content object scrolls over and change the background image?

    I'm fairly new to muse, so i bet it is a simple explanation to this. And don't know how to explain it in a good way. But i want the same effect as on this site http://themeforest.net/item/astlavista-multipurpose-muse-template/full_screen_preview/6459 513?ref=designrazzi . The photos stand still and changes while the blue/green content box slides over. Help anyone?

    I know how I scale the image to fill the browser. The effect I'm looking for is the transition from one image to another, as in http://themeforest.net/item/astlavista-multipurpose-muse-template/full_screen_preview/6459 513?ref=designrazzi. When the green/blue box with "services" scrolls over the screen, the image change from the one with the plane, to the one with the bike.

  • Constrain Browser to size of background image

    I have my background image at 770 x 989. I inserted 1 table
    cell at 100% and imported the background image into it. How do I
    keep the browser from enlarging bigger than the table cell? I'm
    using DW CS3 and have Firefox as my main browser. I'm on a mac
    running Leopard 10.5.2
    [email protected]

    As an example of how you will be trying to accomplish the
    impossible, open
    the page in Firefox, and increase the text size in the
    browser.
    Murray --- ICQ 71997575
    Adobe Community Expert
    (If you *MUST* email me, don't LAUGH when you do so!)
    ==================
    http://www.projectseven.com/go
    - DW FAQs, Tutorials & Resources
    http://www.dwfaq.com - DW FAQs,
    Tutorials & Resources
    ==================
    "Walt F. Schaefer" <[email protected]> wrote in
    message
    news:fvlvur$aeh$[email protected]..
    > If your goal is to make your text content remain fixed
    to the background
    > image you are chasing a will-o'-the-wisp. Best you stop
    and take time to
    > learn HTML & CSS and how they interact.
    >
    >>How do I keep the browser from
    >> enlarging bigger than the table cell?
    >
    > You don't. Again, take time to learn how web pages work
    or you will be
    > chasing your tail.
    >
    > --
    >
    > Walt
    >
    >
    > "James Bechdel" <[email protected]>
    wrote in message
    > news:fvle96$n39$[email protected]..
    >>I have my background image at 770 x 989. I inserted 1
    table cell at 100%
    >>and
    >> imported the background image into it. How do I keep
    the browser from
    >> enlarging bigger than the table cell? I'm using DW
    CS3 and have Firefox
    >> as my
    >> main browser. I'm on a mac running Leopard 10.5.2
    >> [email protected]
    >>
    >
    >

  • Resizing 1) background images and 2) div's containing images

    I just created a web page consisting of little more than an image (about 900 pixels) wide which is set at width=100% in a style sheet. It works great, but I'd like to substitute a smaller image (to reduce page loading time) in mobile devices.
    If it was a background image, I could just declare two different background images based on screen size, but I don't know of any way to swap between images actually inserted in a page.
    So, is it possible to give a background image a width in percentage, similar to a static image? In other words, if my screen was 651 pixels wide, then a static image inside a container spanning the entire screen should also be 651 pixels wide. Can I rig it so that a background image in that container would also be 651 pixels wide?
    Of course, the obvious problem is height. If a background image measures 900 X 1200 pixels, and a screen is 600 pixels wide, then even if there's a style that makes the image 600 pixels wide, it would also have to calculate a height of 800 pixels, and I'm guessing that can't be done.
    Anyway, I'd just like to know what kinds of tricks one can use in making background images and divs containing static images display in percentages based on screen size.
    Thanks.

    Use background-size:cover; for your background images.
    Further reading: http://css-tricks.com/perfect-full-page-background-image/
    EDIT:// For swapping out placed images, it's a little harder to do right now as there is no specified solution from W3C. Some people want to use the srcset attribute, others the <picture> tag. There is no perfect approach right now. See: http://mobile.smashingmagazine.com/2013/08/21/webkit-implements-srcset-and-why-its-a-good- thing/
    One idea is you could hide the image and then load a background-image in the container which is smaller in size. But this would likely bloat your HTML and CSS as you use multiple images - the device will also load both images so you don't gain any real advantage unless you intend to show a croppoed or different image.
    Other ideas: http://mobile.smashingmagazine.com/2013/07/08/choosing-a-responsive-image-solution/
    <div class="image">
         <img src="YourImage.jpg" alt="" width="500" height="250" />
    </div>
    @media only screen and (max-width: 480px) {
         .image img {display:none;}
         .image {
              background:url("YourImage_Mobile.jpg") no-repeat 0 0;
              background-size:cover;
    Another idea is to show/hide the relevant image:
    <img src="YourImage.jpg" alt="" width="500" height="250" class="desktop" />
    <img src="YourImage_mobile.jpg" alt="" width="300" height="180" class="mobile" />
    @media only screen and (max-width: 480px) {
         .desktop {display:none;}
         .mobile {display:block;}

  • Missing Image Size and Position Data

    In AI CS5 the size and position of an image were displayed in the top toolbar when you selected the image.  This is missing in AI CS6, how can I get it back?

    Well I did discover that what I need is called "Transform" but it's already checked in the menu you suggested.  In fact EVERY box is already checked in that menu, and checking or unchecking them from that menu has absolutely no affect on anything anyway. 
    I found that I can expand one of the menus from the right side, and the "Transform" box is there, and that's fine.  But that data (object size and position) was very useful when displayed on the top toolbar in CS5. Any idea how to make it appear in the top toolbar?  It will un-dock (and is very difficult to re-dock)

  • JS CS3 flag duplicate images with scale and rotation differnce

    I've been trying to cut down on the number of images a script I have would produce.  The old script would look for links that are being used multiple times and then just version the link which is fine.  What I am finding this that although a document may have one image linked 9 time 6 times out of the nine the image is scaled and rotated the same amount and the other 3 times the rotation and scaling also match. In this example the image only needs 2 versions the first as the original and the second with the scale and rotation of the image used 3 time let say.
    So to the code:
    The following code will work through the doc and create an array of the links as duplicates:
    function LinkUsage(myLink) {
        var myLinkCounter = 0;
            for (var myCounter =  0; myCounter < myDoc.links.length; myCounter++) {
            if (myLink.filePath == myDoc.links[myCounter].filePath) {
                myLinkCounter++;
        return myLinkCounter
    var myDoc = app.activeDocument;var myNumLinks = [];
    for ( var t = myDoc.links.length-1; t >= 0; t-- ){
        if(LinkUsage(myDoc.links[t])>1){
                myNumLinks.push(myDoc.links[t].id);
    Is there a way to loop through the array and only flag the differnent scale and roatations.  What I should get is that out of the multiple link uasage the image is only changed twice out of the 9 times used.
    I was trying to loop through the array and then loop through it within the loop to compare the link but this does not work for obvious reasons.
    for (var i=0  ; i <myNumLinks.length; i++){
        var valLink = myDoc.links.itemByID( myNumLinks[i]);
            if(valLink.parent.constructor.name == "Image"){
                for (var j=0  ; j<myNumLinks.length; j++){
                    if(myDoc.links.itemByID( myNumLinks[j]).parent.constructor.name == "Image"){
                        if(valLink.parent.parent.images[0].rotationAngle != myDoc.links.itemByID( myNumLinks[j]).parent.parent.images[0].rotationAngle){
                            $.write(myNumLinks[i]+"\n");
    Is what I am trying to do possible and if so any suggestions would be appreciated.
    Cheers, John.

    I think I might be one step closer to getting this to work.  I've been able to just capture the file path of the duplicates using:
    //count the number of times the link is used
    function LinkUsage(myLink) {
        var myLinkCounter = 0;
            for (var myCounter =  0; myCounter < myDoc.links.length; myCounter++) {
            if (myLink.filePath == myDoc.links[myCounter].filePath) {
                myLinkCounter++;
        return myLinkCounter
    //check if the filepath has been added to the array
    function chkVal(val){
        var compCount = 0;
        for(var arr =  0; arr < myNumLinks.length; arr++){
            if(val == myNumLinks[arr] ){
            compCount++;
        if(compCount >=1){
            return false;
            }else{
                return true;
    //check the links inthe doc
    var myDoc = app.activeDocument;
    var myNumLinks = [];
    for ( var t = myDoc.links.length-1; t >= 0; t-- ){
        if(LinkUsage(myDoc.links[t])>1){
            if(myNumLinks == 0){
                myNumLinks.push(myDoc.links[t].filePath);
                }else{
                    if(chkVal(myDoc.links[t].filePath)){
                        myNumLinks.push(myDoc.links[t].filePath);
    for (var i=0  ; i <myNumLinks.length; i++){
        $.write(myNumLinks[i]+"\n");

  • Random background-image with PHP

    I would like to have random images as background-images on a
    page. So I
    made a rotate.php ("SELECT picsid, picsurl FROM pics WHERE
    picsite =
    'home' ORDER BY MD5(RAND()) limit 1") with
    <img src="<?php echo $row_rsimages['picsurl']; ?>"
    alt="" />
    Then I put the following rule into the css-file:
    #pics {
    width: 400px;
    height: 200px;
    background-color: #fff;
    background-image: url(banner.php);
    background-repeat: no-repeat;
    background-position: top left;
    Finally I inserted a div called #pics on the index.php and
    previewed the
    page, and - you are right ;) - the images are not displayed.
    Where have I failed?
    Martin Lang

    Martin Lang wrote:
    > I would like to have random images as background-images
    on a page. So I
    > made a rotate.php
    > background-image: url(banner.php);
    > Where have I failed?
    In several places.
    1. Presumably banner.php is the page that you earlier refer
    to as
    rotate.php. The name should be the same.
    2. It looks as though you're trying to use an <img> tag
    to display a
    background image. That won't work.
    3. If you want banner.php to display an image, you need to
    send the
    correct MIME header and stream the image as a download.
    // code to select the image
    $filepath = '/home/mysite/htdocs/images/'; // path to image
    folder
    $image = $filepath.$row_rsimages['picsurl'];
    if (file_exists($image) && is_readable($image)) {
    $size = filesize($image);
    header('Content-type: image/jpeg');
    header('Content-length: '.$size);
    $file = @fopen($image, 'rb');
    if ($file) {
    fpassthru($file);
    It's actually a lot simpler to do everything in the same
    page.
    Put the recordset at the top of the page to select the random
    image.
    Then put the style block in the head of the document:
    <style type="text/css">
    #pics {
    width: 400px;
    height: 200px;
    background-color: #fff;
    background-image: url(<?php echo $row_rsimages['picsurl'];
    ?>);
    background-repeat: no-repeat;
    background-position: top left;
    </style>
    David Powers, Adobe Community Expert
    Author, "Foundation PHP for Dreamweaver 8" (friends of ED)
    Author, "PHP Solutions" (friends of ED)
    http://foundationphp.com/

  • Inserting 2 background images in to you site

    I've seen many sites with more than 1 background images. How
    can I do that with Dreamweaver CS3?
    I am very curious and I need to know how to do that. I am a
    newbie. Please don't give me horrible instructions. If you could
    please just give me a link to a tutorial or if it is very simple
    just tell me how to do it =]

    Ok, try this, it will give you something to play with. Copy
    all of the code
    below between the *** and *** and paste it into a new html
    page.
    I did not make the top div 1000px wide, that would cause
    quite a few people
    to scroll left to right, but change it if you prefer. Your
    bottom div will
    grow in size depending on content.
    Now someone else may have a better suggestion for you, but
    this is one way
    you can do what you seem to want to do.
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
    Transitional//EN"
    http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="
    http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=utf-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    #topdiv {
    width:90%;
    margin:auto;
    min-height:800px;
    background-image:(right click your mouse, go to Code Hints |
    URL Browser,
    and find your bakcground image file);
    background-position:center;
    background-repeat:no-repeat;
    border:#000066 thin groove;
    background-color:#FFFFCC;
    #bottomdiv {
    width:90%;
    margin:auto;
    border:#3333FF thin groove;
    background-color:#33FF99;
    background-image:(right click your mouse, go to Code Hints |
    URL Browser,
    and find your background image file);
    </style>
    </head>
    <body>
    <div id="topdiv">put 1000 x 800 in the #topdiv css rule
    above in the head
    tag. You will need to put all of your content containers
    inside this div to
    keep bg image inplace.</div>
    <div id="bottomdiv">Put repeating image in #bottomdiv
    in the CSS rule in
    your head tag.. If you have content that is going to match up
    to content in
    the topdiv, you will need to keep same size &
    margins.</div>
    </body>
    </html>
    "Cyberhuntera" <[email protected]> wrote in
    message
    news:[email protected]...
    >I want a background design image(1000x800) center;top and
    a repeating
    > background image(5x5) wich is behind the background.
    >
    > I am novice still, but I want to learn everything about
    HTML.
    > For now I know basic HTML and CSS - almost nothing about
    it :(
    >

Maybe you are looking for

  • Merge Two iTunes folders

    Hi, I would like to organize my music, but I have 2 iTunes folders on my pc. They each contains libraries, a lot of music, artwork etc... What should I do to merge both together? I tried to cut one and past it in the main music folder (next to the ot

  • Video for PPT

    Needing to convert a few videos that were shot in a studio and place them into a ppt presentation. Does anyone know the best export setting to use? The few I have tried kill the quality or are to lager for PPT to play correctly. using FCP 7 Tired WMP

  • Conversion to Excel file??

    How do I covert a PDF to a working excel fiel?

  • Uploading file

    I am trying to upload a file to my server. I am usering struts and using commons-fileupload-1.0.jar. I keep getting an error org.apache.commons.fileupload.FileUpload: method setSizeMax(I)V not found]: java.lang.NoSuchMethodError: org.apache.commons.f

  • Bank statements downloads

    they appear to down load but just appear blank. i've saved them to desktop and tried to open with preview and says can't open because file is empty... the file is empty........ not the bank account.... 3 different banks.  1 banks statements open. two