Safari CSS Background Help

Hello

I'm having a problem with my pages not displaying only not in safari background images. Pages have been implemented in models and background changes to each page. I have a background image defined in a container div, so I can apply a background color the remaining space. This background image is displayed in Safari on a Mac.

http://www.pelinteriors.co.UK/new/

Any help would be most appreciated.

Me_PLC wrote:
> Thanks for the reply. Newsgroup user if I insert the break of compensation where you have suggested it mess up the

formatting of the page. Any suggestions?

It is not possible for her to mess up the format. It's just a clearing
break, which is necessary to 'clear' the floating who are in the
container. This will allow the background image of cloud appears.

In other words, you can "erase" the floats without inserting characters
code in the page itself is to add overflow: hidden; to the container

CSS

This however will not display the background image visually in Dreamweaver
Design view but will be in the browser.

Either way, I tried
in both Safari and
Firefox and it works like a dream, then you must put the
incorrect place.

Tags: Dreamweaver

Similar Questions

  • Color of text in Safari CSS problems

    I don't understand, but for some reason my views of white red in safari css text. Looks fine in firefox. Any suggestions?

    sethry published in macromedia.dreamweaver:

    > I do not understand, but for some reason my white css text appears as
    > red in safari. Looks fine in firefox. Any suggestions?

    > Here is the link: http://www.vcharvesters.org/index3.php

    I don't know if this is the cause, but because you have a bad link to a css
    file, Server error page is load instead of the css. That
    error page affect red links.

    In fact, now that I look further, you link this file twice - once properly
    and once incorrectly. See if deleting this line helps:

    (I also get 404 on header_background_01.jpg)

    --
    Boyd brand "404".
    Keep-on-Learnine :)

  • The cross-platform browser compatibility CSS rule help

    I am an advanced beginner Web Designer.

    The site that I need help is www.sprungtheatre.com

    I designed this site on a PC computer. Each page has a different Background Image CSS rule. The only rule I put is the image and the 'no - repeat'. I did put the terms of its offering.

    Each of these images had an effect feather applied in Illustrator so that the image would have melted in the background black. This works fine on Windows machines in IE and Firefox.

    However, on Macs, the left side of the image is cut off. Who wants to say, it seems if the feathered edge was cut and the picture ends abruptly.

    Is there a way to fix this?

    I just think that is this my occur:

    The rule of CSS Background Image is applied to a nested table that is editable in a model. I think the Mac browswers to move the image to the top-left of the table of "Grandpa" in the set, in which the editable region is nested, cut this part of the image that appears in the region uneditable 'Grandpa' table and showing the part of it that appears in the editable nested table. I hope that makes sense. Application of investment rules would it? Otherwise, what could?

    Thank you very much

    Jon

    My bad: I was looking at my old CSS file. All that now! Thank you!

    Zaphron

  • Please help beginner with CSS background-image

    I use Dreamweaver CS4. I created a site on my computer. D:Data\Local_sites\Gravity_Works. In this directory using Dreamweaver, I created 3 files - css, images and models. In the pictures folder, I have an image - bg_body_winter.jpg. In the Templates folder, I have Gravity-works - Home01.dwt. I have created a new form of the page the template file and named index - test01.html and saved directly in the folder Gravity_Works

    I have this css code in a css in the css folder file:

    {body
    background: url(/images/bg_body_winter.jpg) top of Center no-repeat scroll #C1CAD6;
    }
    {body
    Police: 100% Verdana, Arial, Helvetica, without serif.
    margin: 0;
    }

    I downloaded the site in a test folder on my server at fatcow.com. You can see the page using the link below.

    http://www.openrangeimaging.com/test/gravity-test/index-Test01.html

    The image appears as it should be in Dreamweaver Live View. It does not appear in Design view. It does not appear in the preview of the local file in a browser. The image does not appear when you look at the index file - test01.html that is located on the server by using the link above. The specified background color appears but not the image.

    I'm confused about how I should name the path to the image. I think it must be relative root of the site so that anywhere, I have download the website, the image can be found. Can someone tell me how I should name the path to the image properly.

    I feel that I should know how doing this and looked around for help online and tutorial books I have, but I just don't get it.

    TIA for any help.

    In your linked css file the path to the background image must be as shown below (note points both in front of the bar oblique leader)

    {body
    Background: url (.. / images/bg_body_winter.jpg) no-repeat scroll top centre #C1CAD6;
    }

    If you have this image, the browser is trying to find a 'pictures' folder in your "css" folder and it appears no one.

    If you include the colon before the first slash the browser search the folder 'images' outside your "css" folder and in the folder root site.

  • Safari & CSS rollover behavior problem

    Hello

    I have a navigation bar with working capital and active CSS (CSS3 including easing) settings that are not appear in Safari.  I suspect it has to do with the id selectors, but havn't been able to determine who is at the origin of the problem.  It works great in IE9 and FF4 and degrades well in IE8.  But for a reason, even the simple color attribute does not have the button in Safari.

    Here is a link to see what I mean: http://www.juliepoguebarnes.com/bsr

    Please help a confused Designer.  Any help is appreciated

    -Julie

    @julie

    I was litle time looking at your page and by a part of the documentation of the iOS.  There, I found the answer.

    First, let's look at this piece of CSS:

    ul.topnav li a:hover {
         display: block;
         color: #000;
         width: 100%;
         visibility: visible;
         text-decoration: none;
         height: 49px;
         -webkit-transition: background 500ms ease;
         -moz-transition: background 500ms ease;
         -o-transition: background 500ms ease;
         transition: background 500ms ease;
         -webkit-box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 15, .2);
         -moz-box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 15, .2);
         box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 15, .2);
         background-color: #C7BBAD;
    
    }
    

    The first problem is that the transition is set when the transition occurs.  For all the webkit examples I could find, you must set the transition before the action.  So we will reduce these lines.  I also deleted some lines because they were identical to what has been defined in the normal state and they were so duplicate.

    What I ended up with was:

    ul.topnav li a:hover {
         color: #000;
         background-color: #C7BBAD;
         -webkit-box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 15, .2);
         -moz-box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 15, .2);
         box-shadow: inset 1px 1px 1px 1px rgba(0, 0, 15, .2);
    }
    

    Then we place the cut lines in the original statement of the link:

    ul.topnav li a{
         line-height: 3.5em;
         display:block;
         -webkit-transition: background 500ms ease;
         -moz-transition: background 500ms ease;
         -o-transition: background 500ms ease;
         transition: background 500ms ease;
    }
    

    And there you have it.  He now works in Chrome, Safari, and Firefox to my tests (on a Mac, so I don't mean to Windows/IE).

    @jpiracci

    The link you posted did not have a mention of the CSS3 transition.  Can you please send your affected link?

  • Print CSS background image

    Hello:

    Work on a new site, using a Template Monster (no jokes please) my client wants to use me. I'm not thrilled by using some other configuration and it's no picnic to work, but my graphical skills are not nearly as good as my technique, and the customer wants something more artistic.

    I have a background in the CSS image that doesn't print - it is the photo of the customer, so it is important. As an alternative, so I took out the background and made an AP Div and managed to position correctly on the screen, and it prints well. However, in Safari and Google Chrome, the entire page is stolen in splinters. In IE and FF, no problem.

    Y at - it an easy fix? I'm going to restore the page tonight with the installation of bg image (which is rendered in all my browsers, but does not print) and post for help, but he's not ready now.

    Here is the link to the "Printable".

    Thanks in advance for your help.

    Rgds, Ned

    I did back off and take it slower so I do not cause problems of my own.

    As Jimmy Buffett has said, "well, it could be my fault..."

  • Why the e-mail application strips the CSS background-size property but not when it is used in shorthand?

    I came across the following in the Windows 8 messaging application today, behaviors regarding CSS3 support.

    -http://blog.jmwhite.co.uk/2014/10/03/windows-8-mail-app-background-size-css-property

    -https://litmus.com/community/discussions/550-windows-8-mail-app-and-background-size

    Essentially during the development of a email campaign which make use of the background-size property, the mail in Windows 8/8.1 and same Windows 10 Technical preview application will remove altogether, when it is expressed as follows:

    background-size: 200px 200px;

    If you use the background with a shortcut property it still works OK:

    Background: URL(image-2x.jpg) 0 0 / 200px 200px no-repeat;

    Can someone explain why this behavior is present in the mail application? Is this a bug?

    Hello James,.

    Thanks for posting your query in Microsoft Community Forum.

    I suggest that you re - ask your question in the MSDN forum rather than on this forum to check the settings. MSDN is examined by developers and other it professionals who would more than likely be able to help.
    http://social.msdn.Microsoft.com/forums/en-us/windowsgeneraldevelopmentissues

    Hope this information is useful.

  • Can not get a 2nd blockquote working in CSS - please help

    HI - hope someone can help.  I have a blockquote put in place.  the css is as follows:

    BLOCKQUOTE,

    q,

    {quote

    Background: url #ece5d0 (.. / images/quote.png) no-repeat;

    do-family: "Times New Roman", Times, serif;

    do-size: 18px;

    make-style: italic;

    Width: 804px;

    margin: 5px 0;

    padding: 10px 10px 10px 47px;

    quotes: none;

    line-height: 25px;

    border-radius: 10px;

    box-shadow: 5px 5px 5px #bababa;

    }

    Here is a picture to see what it looks like:

    block1.jpg

    So I need to make a quote from block on the site, but in a more limited area because the foregoing will be cut.  So I thought that I could just copy the code and make a new and edit:

    #blockquote2, q, quote {}

    Background: url #ece5d0 (.. / images/quote.png) no-repeat;

    do-family: "Times New Roman", Times, serif;

    do-size: 18px;

    make-style: italic;

    Width: 620px;

    margin: 5px 0;

    padding: 10px 10px 10px 47px;

    quotes: none;

    line-height: 25px;

    border-radius: 10px;

    box-shadow: 5px 5px 5px #bababa;

    }

    First I tried 'blockquote2' without a DIV as "< blockquote2 > and it does not work so I then did a DIV as above and it still does not work."  Here is the result of it (no citation style as above):

    block2.jpg

    As you will see the width (620) is important to fit into the column.    Here is the code that I put on the page to try to create the citation:

    < div id = "blockquote2" > < br / > < p align = "left" > NOAA mission touches the lives of all Americans, and we are proud of our role in the protection of people and property and to preserve and protect natural resources. I hope that you will explore NOAA and how our products and services can enrich your own life. < /p >

    < p align = "right" > < strong > Dr. Kathryn Sullivan, Director of the NOAA < facilities > < /p > < / div >

    But in any case, someone can tell me why this isn't working and offer a fix?  Any help is appreciated.  Thank you.

    What I would do is, rather than to create an id for the second kind of blockquote, use a class that does not change the width and other attributes you want to change basic blockquote element...

    Somewhere after your css blockquote current...

    {BLOCKQUOTE. ClassName}

    : attribute value;

    : attribute value;

    }

    Then in the html code, you will always use a standard blockquote, with a class element...

    content

    You can use an ID too, but the id can be used only once on a given page, if a class is better if there could be multiple uses.

  • The body of CSS background graphics

    Hello

    I recently tried to redesign a Web page which images the photo shop incorparates and illustator. When I click again on

    Photoshop and illustator to create the background image I do not know what as the width and height in pixels of the

    image should be. So that when I incorparate the image on the web page of the body is just the right size that is to say, it does not extend or is not too short

    or too big seen on different screens. If anyone can help.

    It's the css that displays the image on the web. What would be the right width and height in pixel to design my background image using photoshop or illustrator.

    {body
    background: url(images/img03.jpg);
    margin: 0px;
    padding: 0;
    do-family: Arial, Helvetica, without serif.
    do-size: 12px;

    }

    Wrong forum. It comes to application development. You will get better results in the Dreamweaver forum.

  • Ignored css background color?

    Hello.

    I understand the provision a new site, but for some reason, on my footer background color is ignored by browsers.

    I checked in firebug and it does not even appear in the window of style as having a background color property, but certainly has my CSS file.

    The site is http://www.hwaassociates.co.uk/home.html

    I am attaching the css file to this post.

    Basically, it's the footertop and footer divs in the html page that are not bringing the background colors through.

    Any help would be appreciated.


    Thank you


    Craig

    Hello

    You missed the # in front of the numbers there.

    #footer{background-color:#FF0000;height: 100px;}
    
    PZ
    
  • CSS background image clickable?

    A customer asked me to add a picture on each page in an editable eclipsing where I already have two div (one is a title area and the other is the text that goes underneath). These two divs are inside another div I put the image as a background (without repetition) to the div that contains the other two, and it fits perfect. But I need to be clickable to another page. Any suggestions how I could do this? Can I somehow the clickable background image? Can I do just this area of the clickable div? Remember that the image is behind the corners of the other two div. Here is the code:
    < td width = "514" valign = "top" >
    < div id = "services_right" >
    < div id = "services_copy" >
    < div id = "services_subsub" >
    < h2 > <!-TemplateBeginEditable name = "services_sub"--> <! - TemplateEndEditable - > < / h2 >
    < / div >
    < div align = "left" > <!-TemplateBeginEditable name = "services_content"->
    < p > < / p >
    <! - TemplateEndEditable - > < / div >
    < / div > < / div > < table >

    Thank you

    Brian

    > How do you deal with that?

    Be-

    1. make the insertion of a server side include programmatically, for example, basic
    the current name of the page, or
    2 leaving an editable for secondary navigation and drop the
    wished to include the file in the edit box.

    Or the other approach is so MUCH MORE SIMPLE to use nested templates.

    > Can you do everything with CSS and be able to update properly?

    I do a few sites where I change the physical facilities using CSS
    only, Yes.

    --
    Murray - ICQ 71997575
    Adobe Community Expert
    (If you * MUST * write me, don't don't LAUGH when you do!)
    ==================
    http://www.dreamweavermx-templates.com - template Triage!
    http://www.projectseven.com/go - DW FAQs, tutorials & resources
    http://www.dwfaq.com - DW FAQs, tutorials & resources
    http://www.macromedia.com/support/search/ - Macromedia (MM) Technotes
    ==================

    "yevri" wrote in message
    News:fate9c$HQL$1@forums. Macromedia.com...
    > Here's what I did to solve this problem. I gave up the clickable background
    > image.
    > I think you can do, this site is a bit complicated with nested
    > models and a lot of CSS and structures - some of which are new and some
    > are
    > legacy of a previous developer, so it's a bit messy now. So I have
    > just
    > Redid the CSS in this content area of my model nested until I could put
    > divs
    > side by side and put a picture in the foreground instead of the background.
    > Now
    > It works fine. But this background image map can be useful
    > later.
    >
    > Another thing however, Murray said the models nested is not not a value
    > the
    > hassle - causing more work and inefficiency. I've heard others say that
    > they
    > are a bad idea too. What I wonder, how is - anyone would be when faced with a
    > situation
    > like that (I myself find on most sites) where you have a header
    > and
    > page footer area and content in the Middle, then a section of the site that
    > has
    > interior design with a second level of (possibly on the left side nav
    > as
    (> mine) and generally in the content area. How do you deal with that? I create
    > a
    > model for the header and footer, and then a nested to model the
    > secondary
    > design/NAV. I have 50 pages in this section of Interior design who have
    > their own
    > design based on the design of main model (the site on this post could not
    > be a
    > good example because it is a multiple Frankenstein monster
    > developers and
    (> old and new modes of coding). What an internal nav with a collapse
    > Links.
    > etc. How do you get on each page without a template? Can do you
    > all the

    > with CSS and be able to update properly? Just curious what you use
    > more
    > nested patterns?
    >
    > Thanks again for the help on this.
    >

  • Safari opens the help file for Messages of the application in opening

    I hope someone can help, it's driving me crazy!

    Everytime I open Safari after the reboot, a page opens with the 'Ayuda de messages' text and nothing else. The address in the address bar is ces/es.lproj/index.html file:///Applications/Messages.app/Contents/Resources/iChat.help/Contents/Resour pointing to a help file in the Messages application. I opened the package and I tried to delete this file as an experiment, but he says that it is a system file and cannot be deleted.

    Does anyone know how to find out what is the cause and stop it? And no, my home page is not defined at this address

    Thanks in advance!

    OS X v 10.11.6, Safari 9.1.2, 9.2 Messages

    Quit and restart Safari while holding down the SHIFT key.

    Go?

  • Malware doesn't let me access the Safari preferences.  Help!

    This window pops up suddenly while I was with Safari:

    Of "'http://macintosh-help.com ': "

    Are you sure you want to leave this page?

    At risk security system *.

    Critical security warning! Your Mac has detected an attack on this system, as your IP address seems to be accessible from two different places at the same time. A suspicious connection was attempting to access your Logins, Banking details & tracking of your Internet business.

    Please contact Support Mac team immediately at 1-888-398-6257 (TOLL FREE) and provide the UR97L1DA2TA error code to analyze and solve the

    Trying to close the window just opens a new window with the same or similar message.  I suspect that it is malware taking advantage of a flaw in JAVA.  All resolutions, I watched that require to open Safari preferences but this malware won't let me access the Security tab in the Preferences window.   Help!

    Choose force quit from the Apple menu, close Safari and then run it with the SHIFT key is pressed. If the message reappears, disconnect the computer from the Internet and close the tab Popup came.

    (138731)

  • Trace image invert the colors, showing the black lines in white on black background, helps!

    I used the feature to trace of image for the drawings to the mark several times without any problems.  Today, it is worship the colors, the black lines are now white and white background is black. Help?

    Also for some reason today when I would stick a picture that I copied from Photoshop it would stick much more than the art Board and original. No idea how to solve this problem, or why she is acting funny today?

    menusplus,

    When things become suddenly strange, it may be interesting to try to list.

    The following is a general list of things, try when

    (A) the question is not in a specific file,

    (B) you have a printer installed, connected and turned on if it's a physical printer (you can use Adobe PDF/Acrobat Distiller as a printer by default without the need to have a printer on, of course you will need to specify when you really need print on paper), and

    (B) it is not caused by problems with opening a file from external media (see below).

    You tried/made some of them already; 1 and 2) are easier for temporary strangenesses and 3) and 4) specifically preferences might be corrupt); ((5) is a list in itself and 6) is the last resort.

    If possible / there is, you must record a current work first, of course.

    (1) close Illy and open again.

    (2) restart the computer (you can make up at least 5 times);

    (3) close Illy and press Ctrl + Alt + Shift / Cmd + Option + shift during startup (easy, but irreversible);

    4) move the folder (follow the link with this name) with closed Illy (more tedious but also more thorough and reversible), for CS3 - CC you can find the file here:

    https://helpx.Adobe.com/Illustrator/KB/preference-file-location-Illustrator.html

    5 look through and try the relevant among the other options (click on the link with that name, item 7) is a list of the usual suspects among other applications which can disturb and confuse Illy, point 15) applies to the maybe CS5, CS6 and CC);

    Even worse, you can:

    (6) (check the box to delete the preferences), run the cleanup tool (if you have CS3/CS4/CS5/CS6/CC) to uninstall and reinstall.

    http://www.Adobe.com/support/contact/cscleanertool.html

  • Page CSS-need help beyond editing options in the Page Properties dialog box

    I want to add a simple fill right and the right float to a Web site. The Page Properties dialog box allows a fill only to the left. I know the CSS code that I need to add (right margin) (float) and I could do in Dreamweaver... but is there a way to add my own little bit of code to a page? I know that you can add HTML to an object, but what about adding CSS to a page? It doesn't seem to be in the metadata tab in the <>empty space, or if this is the case, then extra bits that I don't know. Can anyone help?

    You can create your own style, save it in the root folder and a link on the page.

    Alternatively, you can try these options:

    http://musewidgets.com/collections/all/products/js-help-library-Widget

    http://musewidgets.com/collections/all/products/style-magician

    Thank you

    Sanjit

Maybe you are looking for