Image adjustment to fill entirely the divs (no repeat)

Hello!

I'm just trying to build one of my first web pages with dreamweaver CS6 and now I had to do a problem I could solve or find in your forum.

I have a certain container div on my page and for him complete with a photo. This container is flexible and changes its size, so I don't want to just "drag" the image.
Now that I have - for example-set this picture as a background for the div. Ok, but it does not completely fill the container, cause I don't want the image to repeat (sounds stupid in this case) and I don't want to have some sort of margin, too.

I just want that he adapt to the size of the div and to fill 100% of its width and its height.

BTW, sry for my English, I'm no native speaker, so please do not hesitate to ask for any unknown vocab

Ty for your suggestions!

Another way is to do something like this:

(1) create your HTML code like this:

(2) create your CSS, like this:

{body

padding: 0;

margin: 0;

background-color: #999;

}

#nav {}

Width: 960px;

height: 50px;

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

background-repeat: no-repeat;

background-size: cover;

margin: 0 auto;

}

It should work according to your image and the type used.

Tags: Dreamweaver

Similar Questions

  • Someone knows how to take a normal jpg picture and resize to fill entirely the PRE/wallpaper...

    I have a beautiful hi-res jpg photo of my children, I would like to make the wallpaper on my pre, unfortunately he fills all the screen. Does anyone know what size/screen resolution must be converted in order to complete fill the bottom of pre...

    Screen resolution is 320 x 480.  Instructions for saving the photos as wallpaper can be found on page 110, User Guide.

    WyreNut

  • Why image will not appear in the div?

    I'm just starting to try the passage of basic css tables is inspired.  Read a few transitional tutorials on the adobe site.  Can someone ' a Please take a look at this link http://4keys.ca/tryingcss.html and tell me why I can't get the image in live view, preview or the url I posted.  I get the broken link question mark for the image each time.  Thank you.

    What you did sounds OK if your site is correctly set.

    If you use Insert > Image in DW to insert the image, you should not get an operating system file path.

    Should read

    or similar

  • Image in the div tag

    Hello Dreamweavers.

    IM placing an image in my div tag and trying to style it with css, just to see what CSS has really cos Im new.

    IM adding the background image on the Center, but his only is not all the div, the leash of shadows

    on the left and right, so how can I place an image to occupy any of the div tag?

    Thank you.

    u2a.jpg

    I disagree with what Kenneth has recommended. He uses Flash to resize a background to the size of the viewport.

    Here are some tips:

    If you use a background image: url("..) (' / images/background.jpg "); in your CSS, the div will not develop to the background fill the div. So, if you have an image you want to show in a div (and don't want other images and text to sit on it, the best way to do so is not to set the image as a background.

    If you do not want the image in the background, and you want the div to be the same size as the image file, you must determine the dimensions of the image and make the height and the width to your equal to the div.

    The other way is to have your CSS resize your background to fill a div with a predefined size. If you follow these steps:

    {#mydiv}

    Width: 860px;

    height: 700px;

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

    background-size: 100% 100%;

    }

    This before you set the size of your div and make your background image to fill this div. If your background is close to the sheer size of the div, it will look like very well, but if you're stretching a background a lot smaller than your div, you can see a few grain. In this case, the use of Photoshop to aperture this context can be a good idea.

  • How do you text opaque while the div is transparent?

    I put my body to have a background image.

    I inserted a div which has also a background image.

    I want the div be transparent... but the text to be opaque, NOT transparent.

    I tested it using the following css:

    {#holder}
    background-image: url (background2.jpg);
    Width: 900px;
    margin-right: auto;
    left margin: auto;
    height: 1000px;
    filter: Alpha (Opacity = 60);


    {body
    background-attachment: fixed;
    background-image: url(Lapel-Back%203.jpg);
    }

    How can I maintain the transparency in the div and have even normal text looking for...

    the following link is an example of transparency with the text works correctly

    http://www.chipfoose.com/ws_display.asp?filter=home

    Thank you

    They use the best method to achieve the effect in my opinion, a semi-transparent background image. Just create the image in Photoshop/Fireworks and then export it as a 32-bit PNG.

    http://www.chipfoose.com/ksc_assets/system/bg_page.PNG

  • Center the div in parent div Background Image and not the whole page

    I am trying to Center a background image, I have inserted as create a div via the new css rule and will have questions centering correctly on the page. I would it is centered at the top of the page contet - left area of the page content, and it seems that the background image is ignorant parent his div and is centering the page-level. It's a problem because its parent div that 2/3 of the page, therefore covers, in question background image is cropped.

    I did a video showing the problem here, because I'm not sure I use the right words to describe the problem


    Dreamweaver Background Image needs centered at the top of the page content DIV - YouTube

    In other words, I insert a div tag and add a background image so that I can place the content above it, however, the background image seems to be centered in the entire page and not simply within the Division 'parent' in design mode, everything is centered, however, in direct mode, the background image is offset. I can't really explain for good so I made another video.

    Still another problem as can be seen in the video but not prime, since it still works live, is:

    In addition, my navigation bar is direct, but in design mode, it appears at the bottom of the screen. I did fix the position, then he stuck on the right side, so I added a margin of 700px to go right once again, I guess that the problem is due to this.

    I have boldened which, in my view, are source code target areas and css to quickly reduce down, but everything included because I am not knowledgeable enough to know what is relevant or not, I could (and likely) wrong.

    Any other help would be greatly appreciated.

    source code

    <! - head - >

    < head >

    < title > Touch The Universe Productions - Audio Label and Design - Sound Design - diversion Vsti Sound Bank - Goa Trance Presets < /title >

    < meta http-equiv = "Content-Type" content = text/html"; charset = utf-8 "/ >"

    <! - CSS - >

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

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

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

    < style type = "text/css" >

    Judging {}

    background-image: url(images/transparent%20%202.png);

    }

    {b .diversion

    background-image: url(images/transparent%20white.png);

    }

    .diversion a {}

    background-attachment: fixed;

    background-image: url(images/diversion%202.jpg);

    background-repeat: no-repeat;

    background-position: Center;

    }

    {b .diversion

    }

    .f {}

    }

    {.yeay}

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

    background-repeat: no-repeat;

    }

    . GG {}

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

    background-repeat: no-repeat;

    background-position: right top;

    }

    {.ggf}

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

    background-repeat: no-repeat;

    background-position: top center;

    overflow: hidden;

    Padding: 50px 50px 0 0;

    }

    {.dd

    background-attachment: fixed;

    background-image: url(images/diversion%202.jpg);

    background-repeat: no-repeat;

    }

    . TTT {}

    background-attachment: fixed;

    background-image: url(images/diversion%202.jpg);

    background-repeat: no-repeat;

    }

    {.testtt}

    background-attachment: scroll;

    background-image: url(images/Diversion%20640.jpg);

    background-repeat: no-repeat;

    }

    {u}

    background-attachment: fixed;

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

    background-repeat: no-repeat;

    background-position: Center;

    }

    .long {}

    background-attachment: fixed;

    background-image: url(images/transparent%20long.png);

    }

    {.yty}

    background-attachment: fixed;

    background-image: url(images/transparent%20long.png);

    background-repeat: repeat-y;

    }

    {.gggd}

    background-attachment: fixed;

    background-image: url(images/transparent%20long.png);

    background-repeat: repeat-y;

    background-position: Center;

    }

    {.diversion1}

    background-attachment: fixed;

    background-image: url(images/Diversion%20640.jpg);

    background-repeat: no-repeat;

    background-position: center;

    }

    .TT {}

    background-image: url(images/transpare%20long.png);

    }

    < / style >

    <!-[if IE 6] >

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

    <! [endif]-->

    <!-//CSS-->

    "< script type =" text/javascript"SRC="javascript/jquery-1.2.1.pack.js "> < / script >

    < script type = "text/javascript" SRC = "javascript/kriesi.js" > < / script >

    < script type = "text/javascript" SRC = "javascript/cufon - yui.js" > < / script >

    "< script type =" text/javascript"SRC="javascript/TitilliumText14L_600.font.js "> < / script >

    < script type = "text/javascript" >

    CUFON. Replace ("h1, h2, h3, h5, #sidebar li, .footer ', {hover: 'true'}");

    < /script >

    <! - Javascript - >

    < / head >

    <!-/ /-> head

    <! - body - >

    < body >

    <! - top Bar - >

    < div id = "top_bar" >

    <! - Nav container - >

    < div id = "nav_container" >

    <! - logo - >

    < div id = "logo" > < img SRC = "images/logo2.png" alt = "logo" / > < / div > "

    <!--end Logo-->

    <! - Nav - >

    < ul id = "nav" >

    < li > < a HREF = "index.html" > home < /a > < /li >

    < li > < a HREF = "music.html" > music < /a > ' "

    < ul >

    < li > < a HREF = "about.html" > dj sets < /a > < /li > ""

    < li > < a HREF = "about.html" > < /a > artists ' "

    < ul >

    < li > < a HREF = "about.html" > ttu < /a > < /li > ""

    < li > < a HREF = "about.html" > dawn majestic < /a > < /li > ""

    < li > < a HREF = "about.html" > evairta < /a > < /li >

    < li > < a HREF = "about.html" > old future < /a > < /li > ""

    < /ul >

    < /li >

    < /ul >

    < /li >

    < li > < a class = 'on' HREF = "his design.html" > < /a > sound design

    < ul >

    < li > < a HREF = "his banks.html" > < /a > sound banks

    < ul >

    < li > < a HREF = 'dune 2.html' > dune 2 < /a > < /li >

    < li > < a HREF = "diversion.html" > derivation < /a > < /li > ""

    < /ul >

    < /li >

    < li > < a HREF = "drum loops.html" > drum loops < /a > < /li >

    < li > < a HREF = "sample packs.html" > enjoy packs < /a > < /li >

    < /ul >

    < /li >

    < li > < a HREF = "blog.html" > blog < /a >

    < ul >

    < li > < a HREF = "blog.html" > news < /a > < /li > "

    < li > < a HREF = "blog.html" > tutorials < /a > < /li > ""

    < li > < a HREF = "blog.html" > videos < /a > < /li > ""

    < /ul >

    < /li >

    < li > < a HREF = "booking.html" > book < /a > < /li >

    < class li = "last" > < a class = "subscribe" href = "#" > subscribe < /a > < /li >

    < /ul >

    <!--end Nav-->

    < / div >

    <!--end Nav container-->

    < / div >

    <!--end Top Bar-->

    <! - albums content Wrapper - >

    < div id = "topcontent_wrap" >

    <! - content at the top of the page - > 0

    < div id = "topcontent" >

    <! - main content - >

    < div id = "leftcontent" >

    Sound < h1 > - serene Horizon Bank < / h1 >

    < h2 class = "nodivider" > derivation < / h2 >

    < a href = "his banks.html" > < / a >

    < div > < / div >

    < div >

    < p > diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. Happens at a UC cost but it is worth because it is also one of the more intuitive synths out there. < /p >

    < p > < / p >

    < div class = "diversion1" >

    < p > < / p >

    < p > < / p >

    < div class = "tt" >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there. Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. Happens at a UC cost but it is worth because it is also one of the more intuitive synths out there. < /p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p >

    " < iframe width ="90% "height ="250"scrolling =" "frameborder =" "src =" Ay https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/tracks/245233651 & auto_pl = false & hide_related = false & show_comments = true & show_user = true & show_reposts = false & visual = EU tr "> < / iframe > .

    < /p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < / div >

    < p > < / p >

    < / div > < / div >

    < p > < / p >

    < p > diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there.  < /p >

    "< p > < img src =" images/diversion.jpg"alt =" "width ="460"height ="904"class ="imgfloat"/ > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < div class = "u" >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    Diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. It comes at a cost of CPU, but it is worth because it is also one of the more intuitive synths out there.

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < / div >

    < p > < / p >

    < div class = "transparent" >

    < p > < / p >

    < p > < / p >

    < p > diversion of Dymetry Shces is one of the most mind-blowingly beautiful synths out there today, with incredibly rich sound. Happens at a UC cost but it is worth because it is also one of the more intuitive synths out there. < /p >

    < p > < / p >

    < p > < img src = "images/diversion.png" width = "680" height = "482" alt ="" / > < / p > "

    < p > < / p >

    " < iframe width ="100% "height ="450"scrolling =" "frameborder =" "src =" https://w.soundcloud.com/Player/?URL=https%3A//API.soundcloud.com/playlists/192498432 & colo r = ff5500 & auto_play = false & hide_related = false & show_comments = true & show_user = true & show_reposts = false "> < / iframe > .

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < / div >

    < p > < / p >

    < div class = "gggd" >

    class "gggd" goes here < /p > < p > content

    < p > < / p >

    < p > < / p >

    < p > < img src = "images/diversion.png" width = "676" height = "449" alt ="" / > < / p > "

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < p > < / p >

    < / div >

    < p > < / p >

    < p > < / p >

    <! - project - > <! - end project - >

    < / div >

    <! - end main content - >

    <!--> sidebar

    < div id = "sidebar" >

    < h3 class = "sidebartitle" > sound banks < / h3 >

    < ul >

    < li > < a href = "his banks.html" > Dune 2 < /a > < /li >

    < li > < a class = "sidebaron" href = "#" > derivation < /a > < /li >

    < li > < a href = "hive.html" > < /a > < /li > the hive

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

    < li > < a href = "#" > Electra 2 < /a > < /li >

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

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

    < li > < a href = "#" > Omnisphere 2 < /a > < /li >

    < li > < a href = "#" > lush 101 < /a > < /li >

    < /ul >

    < / div >

    <! - end box - >

    < / div >

    <! - high end content - >

    < / div >

    <! - end albums content Wrap - >

    <! - down content Wrapper - >

    < div id = "bottomcontent_wrap" >

    <! - low content - >

    < div id = "bottomcontent" >

    < div class = "left" >

    < h3 class = "icon1" > services < / h3 >

    < ul >

    Versions Audio concerts, Dj Sets, < li > < /li >

    < li > sound design for Music Production < /li >

    Label Audio < li > - accepting demos < /li >

    < /ul >

    < / div >

    < div class = "middle" >

    < h3 class = "icon2" > Touch The Universe < / h3 >

    < class p = "footerp" > owned and operated by Timothy ivory. Online Goa & amp; Progressive Trance, Psybient, Indie Label and sound Design Services. Available for booking within the USA. Demo accepted. < /p >

    < / div >

    < div class = "right" >

    < h3 class = "icon3" > Blog < / h3 >

    < h1 class = "footerblog" > < a href = "#" > key the universe direct is < /a > < / h1 >

    < h1 class = "footerblog" > 02.02.16 < / h1 >

    < class p = "footerp" > launch of the location and label with the first version of operations for embezzlement. < /p >

    < / div >

    <!--> footer

    < div id = "footer" >

    < div id = 'copyright' >

    < img class = "smalllogo" SRC = "images/smalllogo.png" alt = "smalllogo" / > "

    < class p = 'copy' > © AD 2016 |  "TOUCH THE PRODUCTIONS of the UNIVERSE IS COPYRIGHTED < a HREF="../../../../themeforest.net/user/DDStudios@ref=ddstudios "> DDSTUDIOS < /a > < /p >

    < / div >

    < div class = "source" >

    " < p > check out our latest releases of < a href =" https://soundcloud.com/touch_the_universe_productions "> sound Cloud < /a > < /p > .

    < / div >

    < / div >

    <! - end footer - >

    < / div >

    <! - deep content - >

    < / div >

    <! - deep content Wrapper - >

    " < img src = ' http://designerz-crew.info/start/callb.PNG "> < / body > .

    <! - end body - >

    < / html >

    css stylesheet

    {body

    background-color: #191919;

    do-size: 12px;

    do-family: Arial;

    line-height: 23px;

    color: #fff;

    }

    IMG,

    #logo,

    #smallphone,

    #bigphone,

    touch,

    a,

    H3,

    #slidernav li,

    #computer,

    #footer,

    #footer img,

    .smalllogo,

    .learnmore,

    {#submit}

    behavior: url(javascript/iepngfix.htc)

    }

    /* ---------- Hack ---------- */

    .stripNavL, {.stripNavR}

    display: none;

    }

    .stripNav a {}

    text-indent:-9999px;

    }

    {#stripNav0}

    Width: 200px;

    }

    {.stripNav}

    Width: 200px! important;

    }

    .stripNav ul li {}

    margin-left: 10px;

    }

    .stripNav ul {}

    float: right! important;

    }

    {.clearfix}

    Display: inline-block; }

    . Clearfix: after {}

    "content: » ;

    Display: block;

    height: 0;

    Clear: both;

    visibility: hidden; }

    / * Hide IE Mac * /.

    . Clearfix {display: block ;}}

    / * End hide IE Mac * /.

    /* ---------- Typo ---------- */

    {small

    display: block;

    margin: 10px 10px 0 0;

    color: #6fcad7;

    text-transform: uppercase;

    make-weight: bold;

    }

    {small .entry-block

    make-weight: normal;

    text-transform: none;

    }

    {p}

    color: #FFFFFF;

    }

    a, {.link

    color: #6fcad7;

    text-decoration: none;

    }

    H1 {}

    text-transform: uppercase;

    font size: 16.5px;

    color: #FFFFFF;

    }

    H2 {}

    text-transform: uppercase;

    font size: 36.5px;

    color: #6fcad7;

    padding-bottom: 15px;

    Background: url (.. /images/horizontal-Divider.jpg) lower horizontal;

    }

    {.nodivider}

    background-image: none;

    }

    H3 {}

    text-transform: uppercase;

    font size: 16.5px;

    height: 30px;

    color: #6fcad7;

    padding: 5px 0px 0px 35px;

    Background: url (.. / images/icon11.png) left no-repeat;

    }

    H4 {}

    font size: 24 PX.

    color: #6fcad7;

    display: block;

    margin: 20px 0 0 0;

    }

    {.description_p}

    color: #ffffff;

    Padding: 15px 0px;

    Background: url (.. /images/horizontal-Divider.jpg) lower horizontal;

    }

    .Icon1, .icon2, .icon3 {}

    color: #ffffff;

    }

    {.icon1}

    Background: url (.. / images/icon9.png) left no-repeat;

    }

    {.icon2}

    Background: url (.. / images/icon11.png) left no-repeat;

    }

    {.icon3}

    Background: url (.. / images/icon10.png) left no-repeat;

    }

    .footerblog a {}

    color: #FFFFFF;

    text-decoration: none;

    margin: 20px 15px 0px 0px;

    }

    .footerblog a: hover {}

    color: #6fcad7;

    }

    {.footerblog}

    margin-bottom: 5px;

    font size: 15px;

    }

    #footer p {}

    color: #a4a4a4;

    do-size: 10px;

    }

    /* ---------- Logo ---------- */

    #logo {}

    float: left;

    Padding: 12px 0px 0px 10px;

    }

    /* ---------- Slider ---------- */

    {#topcontent_wrap}

    background-color: #0 d 7483;

    overflow: hidden;

    }

    {#topcontent}

    Width: 940px;

    margin: 0 auto 0 auto;

    Background: url (.. / images/bluebg.jpg) top left no-repeat;

    position: relative;

    overflow: hidden;

    Padding: 70px 50px 0 0;

    color: #0FF ;}

    {#info}

    float: right;

    Width: 550px;

    Padding: 0px 0px 0px 35px;

    }

    {#infoleft}

    float: left;

    Width: 550px;

    Padding: 0px 0px 0px 35px;

    }

    {#infoleftsmall}

    float: left;

    Width: 300px;

    Padding: 0px 0px 0px 35px;

    }

    . Video {}

    float: right;

    top of the margin: 45px;

    }

    . Video a {}

    text-decoration: none;

    color: #FFFFFF;

    }

    . Video: hover {}

    color: #6fcad7;

    }

    {.screenshotsfeatures}

    margin: 20px 10px 0px 0px;

    overflow: hidden;

    }

    {.screenshots}

    Width: 300px;

    float: left;

    }

    .the {}

    left margin: 20px;

    float: left;

    }

    .screenshots li {}

    display: block;

    Width: 71px;

    height: 57px;

    Background: url (.. /images/screenshot-BG.jpg top) left no-repeat;

    float: left;

    Padding: 7px;

    margin: 0px 10px 10px 0px;

    }

    . List {}

    Background: url (.. /images/features-BG.jpg top) left no-repeat;

    Width: 196px;

    height: 96px;

    top of the margin: 9px;

    Padding: 0px 0px 33px 11px;

    }

    . List li {}

    color: #96d7e0;

    list-style: circle;

    low-margin: 7px;

    }

    button {}

    float: left;

    margin: 10px 0 0 0;

    }

    {.learnmore}

    Background: url (.. / images/learnmorebtn.png) top left no-repeat;

    Width: 99px;

    height: 30px;

    display: block;

    color: #6fcad7;

    text-transform: uppercase;

    do-size: 11px;

    text-decoration: none;

    make-weight: bold;

    line-height: 30px;

    text-align: center;

    }

    {a.learnmore:hover}

    Background: url (.. / images/learnmorebtn.png) at the bottom left no-repeat;

    }

    {#slidernav}

    position: absolute;

    margin-bottom: 30px;

    right: 10px;

    bottom: 60px banner;

    }

    #slidernav li {}

    Background: url (.. /images/dot-OFF.png top) left no-repeat;

    Width: 12px;

    height: 11px;

    margin-left: 10px;

    float: left;

    }

    #slidernav ul {}

    margin-top: 10px;

    }

    #slidernav li.doton {}

    Background: url (.. /images/dot-on.png top) left no-repeat;

    Width: 12px;

    height: 11px;

    margin-left: 10px;

    float: left;

    }

    #slidernav li a {}

    display: block;

    Width: 12px;

    height: 11px;

    }

    #slidernav li a.the {}

    Background: url (.. /images/dot-on.png top) left no-repeat;

    Width: 12px;

    height: 11px;

    display: block;

    }

    #slidernav li a span {}

    display: none;

    }

    / * - iPhone - computer-* /.

    {#iphone}

    position: relative;

    Padding: 110px, 70px 0px 0px;

    Width: 345px;

    z-index: 1;

    float: left;

    margin:-50px 0 - 30px 0;

    }

    {#smallphone}

    Background: url (.. / images/smallphone.png);

    Width: 159px;

    height: 292px;

    Padding: 0px 0px 22px 57px;

    }

    {#bigphone}

    Background: url (.. / images/bigphone.png);

    Width: 211px;

    height: 378px;

    Padding: 0px 0px 28px 73px;

    position: absolute;

    top: 45px;

    right: 0;

    z index: 9999;

    }

    {#computer}

    Background: url (.. / images/computer.png);

    Width: 319px;

    height: 311px;

    float: right;

    top of the margin: 45px;

    Padding: 15px 0px 0px 25px;

    }

    / * - On the content of the left Page-* /.

    {#leftcontent}

    Width: 680px;

    overflow: hidden;

    float: left;

    }

    {.imgfloat}

    float: left;

    margin: 15px 0px 20px 0px;

    }

    #sidebar {}

    float: left;

    Width: 190px;

    padding-left: 35px;.

    margin: 10px 0px 0px 725px;

    Background: url (.. /images/Color-vertical-div.jpg top) left on repeat-y;

    position: fixed;

    }

    {.sidebartitle}

    Background: none;

    padding: 0px;

    }

    #sidebar ul {}

    margin: 10px 20px 0 0;

    Width: 190px;

    overflow: hidden;

    }

    #sidebar li {}

    margin-bottom: 10px;

    }

    #sidebar li a {}

    text-decoration: none;

    color: #bababa;

    font size: 16.5px;

    }

    #sidebar li a: hover {}

    color: #ffffff;

    }

    {.sidebaron}

    color: #ffffff! important;

    }

    #sidebar ul #social {}

    list-style: none;

    overflow: hidden;

    margin: 0-0 15px 0;

    Padding: 15px 0 0 0;

    Width: 188px;

    }

    #sidebar ul li {} #social

    margin-bottom: 0px;

    margin-top:-5px;

    overflow: hidden;

    float: left;

    }

    #sidebar ul a {} #social

    Width: 32px;

    padding: 0 15px 15px 0;

    overflow: hidden;

    display: block;

    }

    . Clear {}

    Clear: both;

    }

    purchase online .slider {}

    height: 449px;

    }

    / * - Down content-* /.

    {#bottomcontent_wrap}

    Background: url (.. / images/bottomcontentbar.jpg) #191919 top left horizontal;

    Padding: 9px 0px 0px 0px;

    }

    {#bottomcontent}

    Width: 940px;

    margin: 0 auto;

    Background: url (.. / images/bottomcontentbg.jpg) #191919 top left no-repeat;

    overflow: hidden;

    padding-top: 30px;

    }

    .the .middle, {.right

    float: left;

    Width: 250px;

    }

    .the {}

    padding-right: 20px;

    Background: url (.. /images/Dark-vertical-div.jpg) top right repeat-y;

    }

    .the ul {}

    margin: 5px 0px 0px 15px;

    }

    . Li {}

    color: #ffffff;

    list-style: circle;

    low-margin: 7px;

    }

    {.middle}

    padding: 0px 55px;

    }

    . Right {}

    float: right;

    padding-left: 55px;

    Background: url (.. /images/Dark-vertical-div.jpg top) left on repeat-y;

    }

    /* ---------- Contact ---------- */

    #container ul li.success

    {

    color: #ffffff;

    }

    #container ul

    {

    text-align: left;

    color: #6fcad7;

    top of the margin: 15px;

    }

    . TextField {}

    border: 1px solid #aaa;

    Background: #fff;

    padding: 5px;

    do-family: Arial;

    do-size: 12px;

    }

    {#submit}

    margin: 10px 0 0 0;

    Background: url (.. / images/learnmorebtn.png) top left no-repeat;

    Width: 99px;

    height: 30px;

    display: block;

    color: #6fcad7;

    text-transform: uppercase;

    do-size: 11px;

    text-decoration: none;

    make-weight: bold;

    line-height: 30px;

    border: 0;

    cursor: pointer;

    }

    #submit: hover {}

    Background: url (.. / images/learnmorebtn.png) at the bottom left no-repeat;

    }

    . Entry-block {}

    margin: 20px 0 0 0;

    padding: 0 0 20px 0;

    Background: url (.. bottom of horizontal /images/horizontal-Divider.jpg);

    overflow: hidden;

    }

    . Thumb img {}

    border: 3px solid #cfcfcf;

    }

    purchase online .slider {}

    height: 445px;

    overflow: hidden;

    }

    /* ---------- Footer ---------- */

    #footer a {}

    text-decoration: underline;

    color: #CCCCCC;

    }

    #footer {}

    Background: url (.. / images/footerbg.png) top left no-repeat;

    Width: 938px;

    height: 75px;

    float: left;

    margin: 30px 0px;

    padding: 20px 15px;

    }

    #copyright {}

    float: left;

    }

    . Copy {}

    margin left: 55px;

    }

    {.smalllogo}

    padding-top: 5px;

    float: left;

    }

    .source {}

    text-transform: uppercase;

    padding-right: 55px;

    float: right;

    }

    {# block-project}

    margin: 30px 0 0 0;

    overflow: hidden;

    }

    #thumb-{grand

    Width: 374px;

    height: 365px;

    border: 3px solid #cfcfcf;

    float: left;

    margin: 20px 0 0 0;

    }

    {#right-block}

    float: right;

    Width: auto;

    overflow: hidden;

    Width: 340px;

    right margin:-60px banner;

    }

    {#thumb - UL small

    list-style: none;

    overflow: hidden;

    Width: 100%;

    }

    UL #thumb - small li {}

    float: left;

    margin: 20px 0 0 0;

    }

    #thumb - small UL a {}

    float: left;

    height: 97px;

    Width: 122px;

    border: 3px solid #cfcfcf;

    display: block;

    }

    UL #details {}

    list-style: none;

    Width: 100%;

    overflow: hidden;

    top of the margin: 20px;

    }

    UL li {} #details

    Background: url (.. / images/bullet.gif) no repeat 1px 0;

    height: 36px;

    padding: 0 0 0 30px;

    }

    / * Cursor * /.

    .stripViewer .panelContainer .panel ul {}

    text-align: left;

    }

    / * These 2 lines specify style applied during the loading of cursor * /.

    . CSW {width: 100%; height: auto; overflow: hidden ;}}

    . CSW .loading {margin: 200px to 300px 0 0; text-align: center ;}}

    .stripViewer {/ * this is the viewport * /}

    position: relative;

    overflow: hidden;

    / * border: 5px solid #000; / * This is the border. must have the same value for the links * /.

    margin: auto;

    Width: 940px; / * Specified also in .stripViewer .panelContainer .panel below * /.

    height: auto;

    Clear: both;

    / * background: #fff; * /

    }

    .stripViewer .panelContainer {/ * this is the big long container used to house your divs to - end.} Width is calculated and indicated by the JS * /.

    position: relative;

    left: 0; top: 0;

    Width: 100%;

    list-style-type: none;

    / * - moz-user-select: none; This breaks the CSS validation but stops accidental (and intentional - beware) Panel highlighting in Firefox. Some people might find this useful fools, fool. */

    }

    .stripViewer .panelContainer .panel {/ * each Panel is prepared end-to-end * /}

    float: left;

    height: 100%;

    position: relative;

    Width: 940px; / * As specified in .stripViewer above * /.

    }

    .stripViewer .panelContainer .panel .wrapper {/ * wrapper to give some padding in panels, without messing with the existing panel width * /}

    padding: 0px 0 0 0;

    }

    .stripNav {/ * this is the div to hold your nav (AMT generated at run time) * /}

    margin: auto;

    position: absolute;

    z index: 9999;

    bottom: 85px;

    right: 0px;

    }

    .stripNav ul {/ * generated automatically links * /}

    list-style: none;

    }

    .stripNav ul li {}

    float: left;

    right margin: 2px; / * If you change it, remember to adjust the initial value of navWidth in the coda - slider.1.1.1.js * /.

    height: 11px;

    Width: 12px;

    }

    .stripNav a {/ * the nav links * /}

    font size: 1px;

    text-align: center;

    Background: url (.. /images/dot-OFF.png) no-repeat;

    color: #fff;

    text-decoration: none;

    display: block;

    Width: 12px;

    height: 11px;

    }

    .stripNav Li a: hover {}

    Background: url (.. /images/dot-on.png) no-repeat;

    }

    .stripNav li a.the {}

    Background: url (.. /images/dot-on.png) no-repeat;

    color: #fff;

    overflow: hidden;

    Width: 12px;

    height: 11px;

    }

    .stripNavL, .stripNavR {/ * the arrows left and right * /}

    position: absolute;

    top: 230px;

    text-indent:-9000em;

    }

    .stripNavL a, .stripNavR a {}

    display: block;

    height: 40px;

    Width: 40px;

    }

    {.stripNavL}

    left: 0;

    }

    {.stripNavR}

    right: 0;

    }

    I figured out how do. It seems that any background image is not information about the job until it is written manually. This line seems to do the trick.

    position: 200px;

  • Not able to select .jpg to fill selector background image source property s &lt; style &gt; embeded, window closed until I can choose my .jpg to fill in the url field.

    Not able to select .jpg to fill selector background image property of the source s < style > embeded, window closes before I can choose my .jpg to fill in the URL field in the background-image property. Any suggestions? Thank you!

    Manually, enter it in code view.

    background - image: URL (yourimagepath.jpg);

    It could be a code error, DW requires a valid code / clean for many of its functions to work properly. Run http://validator.w3.org/nu and The Service of Validation CSS W3C validators and clean the detected problems. If that doesn't help, clear the cache program or restore preferences can help.

  • My nail of the thumb in bridge always have evidence the adjustments I make to RAW files. Now, for the first time they have not. However when I select the images adjusted and open them in CS6 adjustments are there. I restarted the bridge and PS, and I rest

    My nail of the thumb in bridge always have evidence the adjustments I make to RAW files. Now, for the first time they have not. However when I select the images adjusted and open them in CS6 adjustments are there. I restarted bridge and PS, and I restarted the computer (Mac). Still the same problem.

    I thank assani, but it wasn't the answer. The problem was, I finally understood, that the "option for generation of quality and preview thumbnails" wasn't on "high quality" as it usually is. I have no idea how this happened as I never change this option.

    Thanks a lot for your help.

    Mitchel Gray

  • can't make reactive image inside the div class or id!

    < img class = "reactive" src = "robots.jpg" > "

    the CSS for resoponsive is:

    {img. Responsive}

    Max-width: 100%;

    height: auto;

    }

    Yes. It works very well, but he doesn't work inside the div class

    < div class = "hhh" >

    < img class = "reactive" src = "robots.jpg" > "

    the css of the file for resoponsive is:

    {img. Responsive}

    Max-width: 100%;

    height: auto;

    }

    < / div >

    It does not work. any way to make it work?

    Right.  That is my answer and I stick to it.

    Here is an example online to work with image inside a

  • fluid grid appears as his means to chrome and firefox, but in ie and safari the divs to display as a percentage of the entire screen, rather than as a percentage of the maximum width

    fluid grid appears as his means to chrome and firefox, but in ie and safari the divs to display as a percentage of the entire screen, rather than as a percentage of the maximum width

    I found the problem, thank you! nothing just a missing brace in the css that was causing the problem. the lines of code are numbered, and red when there is a problem (in cc at least 15). I could be the last to know that.

  • DW CC sensitive site, Image problem, how can I get my image to stretch in the width 100% in the div container (wrapper)?

    I have a HomeHeader (upper Div) homebody (body div), 4 low box divs (not important). Im trying to get my homebody (body div) to stretch 100% width on the container as My HomeHeader (upper div) did. The two albums div and body divs are IMAGE backgrounds!

    Capture 1.PNG

    Now, I did something interesting that is, changed my homebody (body div) of the background color in the Red image background and it streched:

    Capture 2.PNG

    I don't want a solid color! I want the image that I designed in photoshop CC. I don't understand how I could get my div image to stretch, but not the image of the body. Help, please!

    PS. This is a copy of my CSS

    ICWOT:

    @media only screen and (min-width: 769px) {}

    {.gridContainer}

    Width: 100%;

    margin: 0;

    Clear: none;

    padding: 0;

    float: none;

    }

    {#HomeHeader}

    background-image: url (.. / WebDesign-assets/images/TopFooterH.jpg);

    height: 61px;

    }

    {#HomeBody}

    background-image: url (.. / WebDesign-assets/images/BodyH.jpg);

    height: 653px;

    }

    {#Home1AboutBlock}

    Width: 24.1758%;

    }

    {#Home2ProjectsBlock}

    Width: 24.1758%;

    margin left: 1.0989 per cent;

    Clear: none;

    }

    {#Home3StoreBlock3}

    margin left: 1.0989 per cent;

    Clear: none;

    Width: 24.1758%;

    height: auto;

    }

    {#Home4ContactBlock4}

    Width: 24.1758%;

    margin left: 1.0989 per cent;

    Clear: none;

    }

    {.zeroMargin_desktop}

    left margin: 0;

    }

    {.hide_desktop}

    display: none;

    }

    }

    Please help once again!

    You realize that will only look great on your screen, right?    Background images don't re - adapt to windows.  So for people on larger or smaller screens, it won't have the same experience.

    You could significantly reduce bandwidth by using a smaller picture with this method.

    Resizable background image full Page

    Nancy O.

  • Image - width of the div and the issue of scale. Help, please

    Hi guys,.

    I have a problem with the bgr image that I can't solve. Here's a tutorial (Web Animation and interactivity with Adobe Edge animate - Designers Fiesta 2012 - YouTube). On the beginning on this movie, this guy has all its items on stage. There is an image called Green who is a div itself (as opposed to a bgr image). Size of this div is much shorter than the image itself, and I don't know how he did it. Whenever I import my (wider) image on the stage, it shows that it is the actual width. I need to be inside the shorter div due later scaling '' operation. '' It's probably very easy to do, but I am new to AE so I would really appreciate your help because I'm stuck.

    Thank you very much

    Hello

    SYM. $("elementName") .css ({'background-size': '100% 100% ', 'background-repeat': 'no-repeat'});

    The above code will be "resize" or "resize" your image.

    You can write on the Board of compositionReady or on creationComplete Panel.

    elementName is the container: the div tag

    Now, how do I load an image inside a rectangle (tag div) using the code:

    SYM. $("Rectangle") .css ({' background-image': "url(images/picture.jpg)", 'background-size': '100% 100% ', 'background-repeat': 'no-repeat'});

  • Image disappears in the Div tag

    Hello Dreamweavers.

    IM by selecting my image that is inside a div tag and when I hit the enter/return is disappeaers. What is going on?

    The reason Im doing this is to add a legend title to my image leaving a space under the pitcure.

    Thank you

    u2a5.jpg

    * {

    margin: 0;

    padding: 0;

    }

    {#box1}

    Width: 600px;

    }

    {.floatright}

    float: right;

    left margin: 12px;

    margin-top: 0px;

    margin-bottom: 9px;

    margin-right: 0px;

    padding-right: 0px;

    }

    < / style >

    < / head >

    < body >

    < div id = "box1" >

    < p > < br >

    Contrary to popular belief, is not simply random text Lorem Ipsum. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years. Richard McClintock, a Professor of Latin at the Hampden - Sydney College in Virginia, one of the more obscure terms latins, computer, looked up a passage of Lorem Ipsum and passing by her quote of the word literature classic, discovered the undoubted source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of the 'of Finibus Bonorum and Malorum"(The extremes of good and evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet... '. ", comes from a line in section 1.10.32 < br >

    Contrary to popular belief, is not simply random text Lorem Ipsum. It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years. Richard McClintock, a Professor of Latin at the Hampden - Sydney College in Virginia, one of the more obscure terms latins, computer, looked up a passage of Lorem Ipsum and passing by her quote of the word literature classic, discovered the undoubted source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of the 'of Finibus Bonorum and Malorum"(The extremes of good and evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet... '. ", comes from a line in section 1.10.32 < /p >

    < p > < / p >

    < p >

    < img src = "_images/award.jpg" width = "240" height = "192" class = "floatright" > contrary to popular belief, Lorem Ipsum is not simply text randomly. " It has roots in a piece of classical Latin literature from 45 BC, making it over 2000 years. Richard McClintock, a Professor of Latin at the Hampden - Sydney College in Virginia, one of the more obscure terms latins, computer, looked up a passage of Lorem Ipsum and passing by her quote of the word literature classic, discovered the undoubted source. Lorem Ipsum comes from sections 1.10.32 and 1.10.33 of the 'of Finibus Bonorum and Malorum"(The extremes of good and evil) by Cicero, written in 45 BC. This book is a treatise on the theory of ethics, very popular during the Renaissance. The first line of Lorem Ipsum, "Lorem ipsum dolor sit amet... '. ", comes from a line in section 1.10.32 < /p >

    < / div >

    < / body >

    < / html >

    IM by selecting my image that is inside a div tag and when I hit the enter/return is disappeaers.

    When you do what you say, it will disappear you tap "return" with the selected image . This will remove the 'image' of this region.

    The solution is to select the image in Design view (if that's what you're comfortable with), hit "right arrow key" and then press return. This will give you space 'after' the image, keeping the image.

  • Can I get an imagefield to fill images on all pages once the image is uploaded

    Hello

    I'm fairly new to LC and I have a dynamic long form from scratch. This form will be used by sales, which will be

    'configure' services, taxes ect to be on the form, then send it to the applicant to be filled. I wish that our sales representative to be able to upload an image to a field of the image (logo) and this logo to be displayed at the top of each page. As I can't seem to add an image field action, how can I do? Million thanks in advance!

    They do not have access to the page master - the master page is what the form is built on, where you set your margins, setting page, boilerplate info, etc.

    You could also have a field of the image on the first page and the image of the field where else you need them and use the global binding to share the same data - for global binding to work they must have the same name and then on the object > link set palette data binding to use global data.

    Or you could code with the rawValue: imageField2.rawValue = imageField1.rawValue;

  • Brightness/contrast adjustment and level of the image will not be saved... help!

    I scanned the sketches of mine in PDF format. Open in PS CC. When I go to Image > brightness/contrast and level settings, it seems changed in preview. But when recording, back to original image. What I am doing wrong? I believe that this is a simple step miss me.

    Thanks in advance!

    Be released in jpg or PNG from the scanner, or if the opening of PDF files in Photoshop, save money with an image as a JPG format.

    Note, Photoshop treats only the PDF files in the form of raster images, but since you swept the sketches, it was used to export to PDF from scanner.

Maybe you are looking for