Help with background image

I am one of those old creators shaped 'table' who decided to try the new way, CSS sites.

I tried to enter a background image to a page and put a table on the top. It did not work because when I added another table inside the main table it reproduces the background which was attached to the page image and not the table.

So I decided to do it in CSS and strange, this duplication thing happened here as well. When you hit the enter diplicates a band thin of the background of the page.

I have attached two screenshots. The first is what it looks like in DreamWeaver CS4 and the other in the browser.

error1.jpg

error2.jpg

The CSS looks like this:

body, p

{

margin-left: 0px;

margin-top: 0px;

background-attachment: fixed;

background-repeat: no-repeat;

background-position: left top;

background-image: url(images/Agtergrond2S.jpg);

}

#container {}

}

{#headerarea}

padding: 10px;

height: 20px;

width: 800px;

left: 260px;

top: 141px;

position: absolute;

are-family: Arial, Helvetica, without serif.

are-size: 16px;

make-weight: bold;

color: #FFF;

}

{#leftarea}

padding: 10px;

height: 600px;

width: 250px;

position: absolute;

left: 0px;

top: 141px;

}

{#mainbodytext}

padding: 10px;

height: 100%;

width: 700px;

position: absolute;

left: 260px;

top: 220px;

are-family: Arial, Helvetica, without serif.

are-size: 12px;

make-style: normal;

color: #FFF;

text-align: left;

background-image: url(images/trans-test.png);

background-repeat: repeat;

}

#header {}

padding: 10px;

height: 20px;

width: 700px;

position: absolute;

left: 260px;

top: 170px;

are-family: Arial, Helvetica, without serif.

-font size: 24 PX.

make-weight: bold;

color: #FFF;

}

{#footerarea}

padding: 10px;

height: 30px;

width: 1280px.

position: absolute;

left: 0px;

top: 800px;

}

a,

a: visited,

a: link {}

color: #424242;

are-family: Arial, Helvetica;

are-size: 12px;

text-decoration: underline;

make-weight: bold;

}

a: hover {}

color: #666666;

are-family: Arial, Helvetica;

text-decoration: highlighted underscore;

are-size: 12px;

make-weight: bold;

}

a: {for more information

color: #oooooo;

do-family: Arial, Helvetica;

text-decoration: underline;

do-size: 12px;

make-weight: bold;

     }

. {To header

are-family: Arial, Helvetica, without serif.

are-size: 18px;

make-style: normal;

make-weight: bold;

color: #cc0000;

}

. OPPORTUNITY {}

are-family: Arial, Helvetica, without serif.

-font size: 13px;

make-style: normal;

make-weight: normal;

are-variant: normal;

}

And the page itself looks like this

< html >

< head >

< title > < /title > African surveyors

< meta http-equiv = "Content-Type" content = text/html"; charset = iso-8859-1 ">"

< META name = "Description" content = "engineering and topographic surveyors, surveyors African," > ""

< META name = "Keywords" content = "surveyors, African, African, topographic surveyors in engineering, land surveyors" >

< META name = "robots" content = "ALL" >

< META name = "copyright" content = "" >

< META name = "rating" content = "Général" >

< META name = "revisit-after" content = "14" >

< META name = "language" content = "EN" >

< META name = 'distribution' content = 'Global' >

< meta http-equiv = "Content-Type" content = text/html"; charset = iso-8859-1 ">"

< link href = "style.css" rel = "stylesheet" type = "text/css" > "

< script src = "SpryAssets/SpryMenuBar.js" type = "text/javascript" > < / script > "

< link href = "SpryAssets/SpryMenuBarHorizontal.css" rel = "stylesheet" type = "text/css" > "

< / head >

< body >

< div id = "container" >

< div id = "headerarea" >

< ul id = "MenuBar1" class = "MenuBarHorizontal" >

< li > < a href = "#" > about us < /a > < /li >

< li > < a href = "#" > contact us < /a > < /li >

< li > < a href = "#" class = "MenuBarItemSubmenu" > Services < /a >

< ul >

< li > < a href = "#" > rendering 3D < /a > < /li >

< li > < a href = "#" > example 3 < /a > < /li >

< /ul >

< /li >

< li > < a class = "MenuBarItemSubmenu" href = "#" > point 3 < /a >

< ul >

< li > < a class = "MenuBarItemSubmenu" href = "#" > point 3.1 < /a >

< ul >

< li > < a href = "#" > section 3.1.1 < /a > < /li >

< li > < a href = "#" > 3.1.2 < /a > < /li >

< /ul >

< /li >

< li > < a href = "#" > point 3.2 < /a > < /li >

< li > < a href = "#" > point 3.3 < /a > < /li >

< /ul >

< /li >

< li > < a href = "#" > point 4 < /a > < /li >

< /ul >

< / div >

< div id = "leftarea" >

< p > the left connect domain < /p >

< / div >

< div id = "mainbodytext" >

< class p 'Body_text' = > place the body of the text here < /p >

< class p = 'Body_text' > and several body text here < /p >

< class p = 'Body_text' > < / p >

< / div >

< div id = "footerarea" >

< p > < /p > footer area

< / div >

< / div >

< div id = "header" >

< h1 class = "Header" > African surveyors < / h1 >

< / div >

< script type = "text/javascript" >

<!--

var MenuBar1 = new Spry.Widget.MenuBar ("MenuBar1", {imgDown: "SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});})

->

< /script >

< / body >

< / html >

Hello:

You have a class css as follows:

body, p

{

left margin: 0px;

margin-top: 0px;

background-attachment: fixed;

background-repeat: no-repeat;

background-position: left top;

background-image: url(images/Agtergrond2S.jpg);

}

This applies to the body and p tag.

So when you enter, you generate one

tag and, therefore, this image is applied due to the class above as a backdrop.

I hope I am on the right track...

Thank you

Vinay

Tags: Dreamweaver

Similar Questions

  • Need help with background image a clickable link

    Hi guys,.

    I want to make the background of my site a background of advertising where the background image is clickable.

    I tried a few tutorials, but none seems not to work

    What I have, it's like my CSS...

    #skin {position: absolute;
        width: 100%;
        height: 800px;
        margin-left: auto;
        margin-right: auto;
        top: 0px;
        left: 0px;
        z-index: -1;
        background-position: fixed;
    }
    

    .. .and this as my HTML code...

    <div id="skin"><a href=""><img src="background.jpg" /></a></div>
    

    It works soon, but the link is only a thin strip of hand and side of the screen for some reason any and don't extend to the background of the entire image.

    Does anyone have any ideas as to where I'm wrong?

    I thank you and hope to hear from you!

    SM

    Spindrift wrote:

    Basically, what I want to do, is to have a skin of advertising that the background (maybe just a dummy container div to serve in the background) of my site, while he fills the area outside the container div of my sites and opens a link if clicked.

    Anyone know how I can do this?

    This can be done relatively easily, but it's not very pretty. You will need to use a full great for the background image, unless you plan to repeat, and then assign the clickable containing exactly this size. See code and screenshot below. Tested in FF, Chrome and IE9.

  • Menu Spry, problems with background images in Internet Explorer

    Hello

    Looking for help from someone more qualified than me with some menus spry.  I have problems with background images don't show is not for some of my items menu in Internet Explorer.  Safari and firefox seem to accept it's ok.

    Here is a link to the menu: http://www.scottbrownwebdesign.com/beta/HTML/index.html

    and here is a link to the spry .css: http://www.scottbrownwebdesign.com/beta/HTML/SpryAssets/SpryMenuBarHorizontal.CSS

    I know that these are the elements that have the drop down or the side of the arrows.  I can't have two background images that I can?

    Thanks in advance,

    -Scott

    My first thought...

                         display: inline;          f\loat: left;          background: #FFF;
    
    Try declaring the background-image here as well... where it says not to mess with unless you know what you are doing.
    
    I'm just guessing though. If I had more time I'd look into it further but I do not.
    
  • Please help: content still is not fixed with background image when I resize the browser window

    I am designing a Web site and want my content appear in the same location relative to the background image, regardless of whether or not the browser window is resized. How can I do this? (the content always moves when I preview the page)

    You can pin the object on the page so that it remains in the same position with any size of the screen.

    Thank you

    Sanjit

  • Problem with background Images and scrolling

    I had to face for a while to get background pictures are working properly. Here's what I do:

    VFM VerticalFieldManager = new VerticalFieldManager();

    Card of bitmap = Bitmap.getBitmapResource ("MyImage.jpg");

    Background bg = BackgroundFactory.createBitmapBackground (map);

    vfm.setBackground (bg);

    This works, but has entrapment. First of all, he painted only as much as you have fields too much room, so I have to add empty fields just to occupy vertical space. However, on a page with something like a listField, where the height is variable, this can lead to what the background image are starting to repeat and to allow scrolling.

    What I want to do is to block all the scrolling and have the training exactly fill the screen with no scrolling or white empty places.

    I'll just on this wrong? Would really love to help...

    Hello

    Hope this will help you.

    class LoginScreen extends MainScreen {    //Manager        private VerticalFieldManager _manager;
    
        LoginScreen() {        //Set Background image            _manager = (VerticalFieldManager)getMainManager();            Background bg = BackgroundFactory.createBitmapBackground(Bitmap.getBitmapResource("back.png"));            _manager.setBackground(bg);
    
       }}
    

    Add this manageron your screen don't add any component in this handler.

    You add fields in the Manager of the other, and adds that the Manager on the screen.

    Let me know if this solves your problem or not.

  • Text single line with background Image field

    Hello

    I have the following requirement for a small number of topics on BasicEditField, but I couldn't find answers to my requirement, so post to the same

    My requirement

    1 must be the only editor of line text field with a width and a predefined height.

    2. If a background Image(For better look-rounded edge image like in Broswer)

    3. If the number of characters exceeds the single line, it has scroll horizontally right and from characters to scroll left with the appropriate property of the ellipse.

    4. in entering an Enter key (Center of select navigation Keys), it should call my method to perform an action.

    Enjoy a quick help on this

    Thanks in advance

    Q1. BasicEditField.NO_NEWLINE will stop people pressing enter and get a new line.

    Regarding your second question, I recommend that you check out the two videos on screens and area managers.

    As a general rule, a field is laid out (i.e. tells his manager what size he needs and then this rectangle is placed), then painted.  Exhibitor is managed by managers and put sublayout on the page for the fields.  The more important than sublayout and put thing in page do is specify the scope (width and height) they need, which fiddles and managers to make using the measure.

    Once all fields was laid out, then the visible parts of each field are painted using paint.  I've never used subpaint.

    I hope this helps.

  • Puzzle pieces filled with background image?

    Hello community, there.
    On exactly 0:21 of this video: https://www.YouTube.com/watch?v=HTT6aaoq-OS ; the guy selects the pieces of the puzzle and then proceeds to copy them into a new layer. But the new pieces of the puzzle are now filled with the image of the background. Could you recognize this specific effect/technique or direct me to the shortcuts he used? Any help is greatly appreciated, friends

    PS. I think that it is a variant of the clipping mask - I tried with the clipping mask, but I can't get the search results

    After selecting the pieces of the puzzle, he selects the bg layer and press ctrl/cmd-J.

  • Need help with background body color

    Hello world

    I am a completely new Dreamweaver user and have not created a site for years. Last program that I used was the first Page!

    I'm messing with Dreamweaver CS5 and try to create a Web site for my work.

    Here's a problem I have.

    Is it possible to have the background color of your body to be 2 different colors? My site design starts with a 3 bars + header/footer. I have my head looking the way I want to, and now I am trying to get my background color for the body to be right. I speak not of 'body' is the one that surrounds the header/footer page, column, content, left column.

    Right now it's a solid color that I adjusted using the page properties.

    Is it possible to have a color starting at the top of the page and end at the back of my head, and then have the rest of the body (under the header) be a completely different color?

    If so, any help would be greatly appreciated!

    Thank you!

    Vik

    I am a completely new Dreamweaver user and have not created a site for years. Last program that I used was the first Page!

    You certainly need to examine your HTML and CSS, then, as DW will be expected to bring you knowledge both at the table.  PS didn't feel it's valid HTML or coding standards.  It is diametrically opposed to the current version of DW!

    Is it possible to have a color starting at the top of the page and end at the back of my head, and then have the rest of the body (under the header) be a completely different color?

    Give the body of the page a single color as its background color.  Make the color of the region under the heading.  Then use a graphic rectangle unique color that is as big as your head and you set as background image for the page, having only horizontal place with this CSS.

    Body {background - image: url (path_to_your_image.gif); background-repeat: repeat-x ;}}

    Who should do in light of the information you have provided to us.

  • Grid height of container to 100% with background image

    Hello

    I am a beginner with grids of fluid... I want to get whaY I always used to call a div wrapper - up to 100% with a background image, so I can put all my tests on top of it... and I can't get the grid container to stretch 100%...

    I would like to use the container to contain the image, and then run the other diving on top (within) can it... someone please give me a leg upward?

    Thank you

    Try this:

    Resizable background image full Page

    Nancy O.

  • Border problems with background image

    Hello

    I have a problem with my background image. I have fillings of browser size the original value and activated scale option in the middle. The image has a resolution of 1920x1080px. But when I now change the size of my browser I get a white border on the left or on the right size.


    Small to large size of Office Office:

    https://DL.dropboxusercontent.com/u/84237067/kleinzugross.PNG

    Large size of small office desktop:

    https://DL.dropboxusercontent.com/u/84237067/grosszuklein.PNG

    Hope you understand me, my English for this specific part is not perfect it.

    Greetings

    Marcel

    I checked out the site but don't see any white space on the page with large screens, I think that you have already solved the problem?

    Thank you

    Sanjit

  • Alignment of header with background image

    I have problems trying to align my header with my background image image. I created a table with a width of 100%. The height of my image is 108px. I can't get the cell as 108px also.

    I get the error message "the value you entered would make this table becomes lower than its minimum size.» It will be reduced to a size valed. »

    So basically my background image starts a couple px before my image and therrfore dosent align correctly.

    Any ideas?

    Thank you so much Michael! I didn't know that a white in the cellular space, padding box does not mean 0. I put in zeros and problem solved!

  • Need help with tutorial images Gallery.

    Hi all

    No response from Apex listener Forum... moved here...

    Headset - 2.0.2.133.14.47 apex

    Apex - 4.2.2.00.11

    When you run the image gallery application according to the tutorial, page just show a blank screen with no image upload button.

    Use 22.0 Firefox and Chrome 28.0.1500.72.

    Firebug does not display a script error.

    Has recreated the tutorial on apex.oracle.com with the same result as above.

    http://Apex.Oracle.com/pls/Apex/f?p=4550:1:F4550_P1_COMPANY:HANAMIKE

    Workspace: HANAMIKE

    User name: [email protected]

    Password: yesla


    Using the user name = resteasy_admin password = resteasy_admin on apex.oracle.com.

    Had changed the JS tutorial below:

    var workspace_path_prefix = "resteasy";     = > var workspace_path_prefix = "hanamike";


    Another strange problem was when to try the RESTFUL according to the tutorial service when you click on the button 'TEST', has detected the error 404

    Problem on behalf of space of overtime in the URL as below:

    http://Apex.Oracle.com/pls/Apex/hanamike/hanamike/gallery/images/

    Had to manually change:

    http://Apex.Oracle.com/pls/Apex/hanamike/gallery/images/


    Note that the version of the listener on apex.oracle.com is:

    APEX_LISTENER_VERSION2.0.3.165.10.09


    Thanks in advance.

    Zack


    Post edited by: Zack.L

    Hi Zack,

    Please provide the credentials to connect to your workspace.  I took a quick glance to your RESTful Service and applications associated and noticed that he was missing something - the "Upload Image" button! It seems therefore that the section "Create the gallery app" is not a step to create an HTML region, with the model "Button region without title" of the region and with its region defined as source:

    Download Image

    You will see in the JS that there is a reference to #upload - btn, but there is no object on your page.  I created a copy of your application, which includes this new area of HTML, and you'll see I downloaded an image as a demo.  I contacted the team APEX listener re missing instructions, for which I hope will be fixed in the next version.  My apologies for the confusion, but I hope that you are on the right track now.  Regarding the behaviour you noticed with the URL generated by the 'Test' utility, thanks for that bring to our attention.  I'll do some additional research it and log a bug if necessary.

    Kind regards

    Hilary

  • Using tracing image, and then replacing with background image

    I am very new to Dreamweaver and am trying to put together a very simple site.

    I use image tracing for the mode of disposal table - and it am followed exactly. However, when I put it off to test it in my browser,

    nothing aligns how it shows in my work environment.

    Am I missing something obvious 'very '? Thank you.

    (1) never use the mode table layout. It's a terrible way to build web pages.

    (2) no matter how hard you try, you can't make things stick to a large background image.  It's like trying to nail Jell-o to a wall.

    Have a look at the following tutorials. These will get on the right track.

    Tables to CSS Web Design part 1-
    http://www.Adobe.com/devnet/Dreamweaver/articles/table_to_css_pt1.html

    Tables to CSS Web Design part 2-
    http://www.Adobe.com/devnet/Dreamweaver/articles/table_to_css_pt2.html

    Post back if you have problems.

    Nancy O.
    ALT-Web Design & Publishing
    Web | Graphics | Print | Media specialists
    http://ALT-Web.com/
    http://Twitter.com/ALTWEB
    http://ALT-Web.blogspot.com

  • The Spry menu bar personalized with background Images

    Hello

    Is there a way to make a spry menu horizontal bar by using an image of different background of a different width for each item?  In other words, the format individually each menu item.  I'm doing a bar with drop down menus using custom images, that I created in Photoshop, but have only been able to use the same image for all the items in the menu.  Thank you.

    Each menu item will require that this is the style and the name of the class of its own.

    Each class will have to be applied to each following anchor tag:

    http://ALT-Web.com/demos/multi-colored-list-menu.shtml

    Nancy O.

    ALT-Web Design & Publishing

    Web | Graphics | Print | Media specialists

    http://ALT-Web.com/

  • Help with inserting image! It does not appear...

    Hello. I am a newbie and really wrong with the basics. Please can someone help me?

    All I'm doing is to insert a logo at the bottom of the page (or as much as really!) I inserted the file on the page that shows fine in dreamweaver, but it doesn't seem to 'put' and when I check the page online that shows simply that the name of the image.

    You're prob. saying "duhhh" in your head right now! but I'm used to photoshop and illustrator, I find dreamweaver so complicated!

    You can see what I mean on my topic page - www.sarahray.co.uk/about.htm (down under in Scripture it says logo AOI. This is what I'm trying to put.)

    Any help MUCH appreciated! XX

    Still, you define a local site folder in Dreamweaver?

    Sites > Manage Sites > new...

    If you ignore this critical first step all your links will be broken.

    Start here:

    http://www.Adobe.com/devnet/Dreamweaver/articles/first_website_pt1.html

    Nancy O.
    ALT-Web Design & Publishing
    Web | Graphics | Print | Media specialists
    http://ALT-Web.com/
    http://Twitter.com/ALTWEB

Maybe you are looking for

  • Basler sca640-70gc. IMAQdx

    Hello I have a problem. I used sCA 640-70gc and labview 2010, I do not want to use IMAQdx. So I try Labview IMAQ and some Pylon(basler software) C or C++ source but I just can't. I have try call back libray, ActiveX (cameracontrol), shared Liabrary P

  • purchase card form signals separately

    HelloAs you know that stereo can choose two signals simultaneously. I am interested to receive signals using sound card and display them separately on vague shape graph. Can anyone please help me to accomplish my task.Thank you.

  • Numlock with XP Professional key

    How can I get the NumLock key on the system to start with XP Professional?

  • Have applications not valid in recycled and am not able to delete

    am unable to remove invalid applicatons in recycled

  • How can I make my monitor go black when is useless?

    I have two Win 7 PCs. For some reason, one of them the monitor will always black (energy saving and 'save' the screen, I presume), but this does not happen on the other. As it is now, I have to unplug the screen when I want to be away from him for a