Background images look rough

I looked around but didn't find a post on this or, missed it,
if it's posted. My situation is this. When I open my site in every
other browser (ie., firefox, opera, safari, camino, and flock) the
background image shows up correctly. When I open it in IE 7 it
looks darker and rough. I tried placing it as jpeg and png. They
both look the same. Everything else works fine, links, text. Any
thoughts.
Thanks...

I see. Huh? 8)
Murray --- ICQ 71997575
Adobe Community Expert
(If you *MUST* email me, don't LAUGH when you do so!)
==================
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
==================
"RedSamurai" <[email protected]> wrote in
message
news:g14bqa$h7d$[email protected]..
>
quote:
Originally posted by:
Newsgroup User
> Why is there so much empty space at the bottom of the
content?
>
> --
> Murray --- ICQ 71997575
> Adobe Community Expert
> (If you *MUST* email me, don't LAUGH when you do so!)
> ==================
>
http://www.projectseven.com/go
- DW FAQs, Tutorials & Resources
>
http://www.dwfaq.com - DW FAQs,
Tutorials & Resources
> ==================
>
>
> "RedSamurai" <[email protected]> wrote
in message
> news:g143og$8ou$[email protected]..
> >I apologize. A duh moment. Here's the address
> >
> >
http://www.garza-design.com
> >
> > Thanks...
>
>
>
>
>

Similar Messages

Background Image for BIP 'Certificate'

Hey there,
Im new to BIP, I ususally lurk over in the OBIEE side.
Im trying to create a 'certificate' type of report in BIP, I've got it working to an extent, heres what I've done :
pull in the certificate 'skeleton' image as the background image in MS Word, plot the BIP data fields in the name, date & manager locations on the certificate etc. Repeating Group is set for each row, i get a certificate per user - perfect !
except....
the background image looks fine in Word when viewing the page at 100% in 'Print Layout' but the resulting PDF has aligned the picture differently so the location of the text fields I plot in Word is not mirrored in the PDF.
I should add the background image needs to cover 100% of the page.
Is there an optimum size for an A4 background ? I know paper sizes are not measured in pixels, but does the PDF generation use a pre-set DPI that I can work from ? Anybody else have probs lining up a background image?
Bit stuck , I thought this would be the easy bit :-)
Thanks in advance,
Alastair

For those that are interested I've achieved my goal,
I gave up trying to decipher why small changes to Background images & Watermarks where having a large effect on the PDF output, so I've embedded the picture in the Word template and through trial and error lined them up.
Im still not happy that what I see in Word is not directly what I see in the PDF, I must have created 50+ previews using the left a bit, left a bit, down a bit , left a bit approach :-) But they now line up at least in the PDF output.
I'd be interested if anybody knows workarounds, the problem seems to be when you use picture wrapping properties of behind text or in front of text. I guess RTF doesn't support all the Word options (ie text boxes etc) so we are left with the trial and error approach.
Reminds me of the pain of working with Oracle reports trying to line things up :-) I think I'll stay over in OBIEE land

Help with background image (Not sure how to ask this..........)

I have just started to try and make my first site. I designed it in Photoshop first as I learned in many tutorials. I don't know why my background image looks like this when I scale down below 100%, but at 100% or "fit all"&"fit width" it doesn't change and I can't move it with the hand tool or scroll it. I'm sorry, I'm just learning.
Thank you.

Hello,
in addition, I tried this (page properties = translated from my German DW) too an the only difference had been this "missing end bracket".
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>ioneglines.com</title>
<style type="text/css">
body {
background-image: url(myImage.png);
background-repeat: no-repeat;
</style>
</head>
<body>
</body>
</html>
... before you insert your image as a background image, you have to give it the dimensions, you want to see in your file. Please use try and error method.
Hans-Günter

Fluid Dreamweaver background image

Hi,
I created a fluid html5 page and it's background image looks fine when it is at the desk top size, but when the browser shrinks to mobile or ipad size back ground image resizes and shrinks!
I tested it in ipad and mobile and it shows the same issue!
I have been told that, I need to remover the      background-size: 100%;      from my background class in my css, but I did that and it didnt work.
.background{
        background-image:url(../image.jpg);
        margin:0;
        padding:0;
        color: #333;
        font: normal 0.6em sans-serif,Arial;
        background-repeat: no-repeat;
        background-position: center top;
        background-color:#EBECE4;
        background-size: 100%;
        width: 100%;
Is there any help?
Thanks,

Does this do what you want?
body {
     min-width: 470px;
     max-width: 1580px;
     background: url(http://placehold.it/900x700.jpg) no-repeat center center fixed;
     /**for Safari,Chrome**/
     -webkit-background-size: cover;
     /**for Firefox**/
     -moz-background-size: cover;
     /**for Opera**/
     -o-background-size: cover;
     /**for other browsers**/
     background-size: cover;
.wrapper {
    width: 90%;
    margin:10% auto;
    background: rgba(255,204,204,0.5);
    color:#C06;
    padding: 2%;
</style>
</head>
<body>
<div class="wrapper">
<h3>Heading 3</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Mauris vitae libero lacus, vel hendrerit nisi!Maecenas quis velit nisl, volutpat viverra felis. Vestibulum luctus mauris sed sem dapibus luctus. Pellentesque aliquet aliquet ligula, et sagittis justo auctor varius. Quisque varius scelerisque nunc eget rhoncus. Aenean tristique enim ut ante dignissim.</p>

</div>
</body>
</html>
Nancy O.

Preview what a background 'Image Repeat' will look like?

I want to preview some website background images that I have which are 1 pixel wide without having to upload to the website and refresh the page. Is there a way to preview images repeating in either Adobe Bridge or Adobe Photoshop or any product in the Adobe Creative Cloud for that matter without having to upload to the website and refresh the page? I would ideally like to scroll through the images and have it simulate the repeat horizontal style.

Not sure that is what I'm looking for.
I have over 2000 different gradients for website backgrounds that I just want to scroll through to pick the one I want but I need the image to repeat horizontally so that I can see it because it's only 1 pixel wide ...
Ideally, I would like to just be able to hit my arrow key down and down and down and preview what the background would look like super quickly so I can pick the one I like best.
Hopefully that makes better sense.
Thanks!
Something like this website, but where i don't have to upload files to the web.
http://lab.rails2u.com/bgmaker/

Downconverting HD to SD -- background images sometime look jittery

I have made many SD dvds of this project along the way. The previous ones were fine. I haven't changed the way I make them and am even using same kind of DVDs, but now suddenly the quality is terrible. In addition to background images appearing jittery at times, the image appears out of focus at other times (and it really isn't). The overall quality is just bad. Any thoughts?

Raymond Opheikens wrote:
Can anyone give us some suggestions for the best workflow to convert 1080p 24fps Sony EX1 >highest quality images to SD and keep them as sharp as the original HD image?
I can only offer the obvious that SD will never look as sharp as HD. Also progressive digital to interlaced with a size reduction is going to have problems with edge resolution.
o| TOnyTOny |o

Illustrator cc image looks pixelated after saving with transparent background

as the title states; image looks pixelated after saving with transparent background...
i created a logo in adobe illustrator cc and i wanted to saved it for web in order to be able to copy and paste the logo where ever I wanted but the image looks extremely pixelated after saving as an png, and for web. Is there a solution for this?
Any help is appreciated.
Thank you!!
Jon

What DPI did you save as:
You should always save as 300dpi, then you can always reduce the size as needed.
Another thing, don't copy and paste, that always causes that Problem.
In Acrobat you should open Tools Menu click on Content Editing the Add Image.
Then click on image and choose Properties and place where you want and size as you desire.

Is there a way I can add be background image to my sharepoint site with look and feel?

Whenever i add any background image with "look and feel" it stretches the image. I've tried modifying the CSS file (in body and tried .ms-backgroundImage setting "background-size:inherit !important;") to fix it, but it doesn't seem to
have any effect. I there anyway i can add a background image to the master html or css code and get it to not stretch?
Thanks
James T.F

Hi,
According to your post, my understanding is that you wanted to add background image to sharepoint site with look and feel.
We can define the Image Url in the Composed looks (Site Settings > Web Designer Galleries > Composed looks) to add background.
However, the image will be stretched to fill the viewport at 100%.
Though we can override the CSS attributes which would allow the image to repeat, but instead I recommend to go the no CSS route and switched the background to a much larger one that would fill the viewport nicely without looking pixelated.
More information:
SharePoint 2013 Branding: A New Approach
SharePoint 2013's Branding – My first three lessons
Best Regards,
Linda Li
Linda Li
TechNet Community Support

Looking to create fully editable PDF files with background images

Hello and thank you, I create menu's and flyers for a group of restaurants. I need to make text editable PDF menus with background images. I believe Livecycle is able to do this, but would really like to hear it from someone who knows for sure. Again thank you.
Cheers,
Charlie

Yes it can. Download a free trial and try it out.

Vertical tabbed panel with background image

Hi all,
I have a working vertical tabbed panel. For the text that's shown, there's a background image assigned to the associated DIV.
However...
The background image that's shown is clipped to the bottom of the text.
In other words, if I have 3 lines of text, the bottom of the background image only goes as far down as the bottom line of text. In order to show the entire image, I have to put in a lot of </ br> tags for "empty" text, not a very good approach.
More of the backgound will show if I increase the text text size via the browser.
To try to describe this more accurately,
Let's say I have a background image that's 600 px in height, but the lines of text only measure to 400px. That means that the bottom 200 px of the image doesn't show, unless I add more lines of text.
Hoping someone has an answer!
Thanks,
Jerry

Gramps,
Again, thanks for your time. While we're now full time commercial photographers (http://www.jerryandlois.com), I was a software engineer for some 20+ years in an earlier life, all on the application side of things. Not really any appreciable time with website stuff.
There are a few more tech/how-to questions I have that are specific to CSS, in terms of polishing up the small site I'm working on. However these are not SPRY related, unless SPRY can solve this for me.
In particular, suppose I have a large block with a background image and a body of text. I want to ensure the text wraps around the image, rather than being a complete overlay where the text can collide with the main body of the photo.
Example:
http://jerryandloisstudios.com/about.html
The issue is that the text is resizable, by design of course. Is there any way to manage these two elements (text and image) so they get along the right way? We want the text to overlay some of the image, but only on the periphery, if that makes sense. So far, the only solution I've seen is to keep the text formatted roughly in a column so that if its size increases all will still be OK. But... artistically that just doesn't look right.
If you're up for it, I'd certainly welcome a private email thread, unless others can also benefit from the rather newbie questions I'm raising: [email protected]
Again, thank you for your help!!!
Jerry

Background image on Interactive report column

Hi,
I have had a request from a customer with regards to displaying a background image behind a column on an interactive report.
The interactive report is used to show notes added for an individual in the application.
They want to display a note image behind the text to make the note stand out better.
Is it possible to add a background image to the each cell in the interactive report
Thanks
Kevin
Edited by: Cod'ead on Nov 30, 2009 3:43 PM

Take a look at this list of threads (You may find something that helps..) : Oracle Application Express (APEX)
Thank you,
Tony Miller
Webster, TX

Won't display background image in browser.

My background image displays in dreamweaver and in the live view but it doesn't display in the browser when I try to view in a browser or when I publish the website. I have spend hours looking for a solution and I am not sure what the problem is. I have checked the code on the following websites and it comes out ok:
http://jigsaw.w3.org/css-validator/validator
http://validator.w3.org/check
I have also tried my code with and without the overflow: hidden; under #container where the image should be displayed. (i was trying a new way to design -ie without basic grid and floating everything so the container can be removed if needed)
here is my code. Please help!!! thank you in advance!!!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Jan Kardys' Literary Agency</title>
<style type="text/css">
#header {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    float: left;
    width: 930px;
    color: #3F9;
#Menu_bar {
    float: left;
    width: 190px;
#Page_Content {
    float: right;
    width: 725px;
    height: 500px;
#footer {
    float: left;
    width: 930px;
#Main_content {
    float: left;
    width: 510px;
#xtra_content {
    float: right;
    width: 190px;
#container {
    width: 930px;
    margin: 0 auto;
    background-image: url(/Images/Parchment.gif);
    overflow: hidden;
</style>
<script src="file:///C|/Users/james/Documents/DREAMWEAVER SITES/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="file:///C|/Users/james/Documents/DREAMWEAVER SITES/SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />
<style type="text/css">
body {
</style>
</head>
<body>
<div id= "container">
<div id="header"><h1>Jan kardy's Literary Agency</h1></div>
<div id="Menu_bar">
<ul id="Vertical_menubar" class="MenuBarVertical">
    <li><a href="#">Home</a></li>
    <li><a href="#">About Jan Kardys</a></li>
    <li><a class="MenuBarItemSubmenu" href="#">Rescources</a>
      <ul>
        <li><a class="MenuBarItemSubmenu" href="#">Education Connection</a>
        </li>
        <li><a href="#">Submission Guidelines</a></li>
        <li><a href="#">First Steps to Publishing</a></li>
        <li><a href="http://advancenetworkingunicorn.blogspot.com/">Advanceced Networkinig Blog</a></li>
        <li><a href="#">Library & Publishing Events</a></li>
</ul>
    </li>
    <li><a href="#">Client Links</a></li>
    <li><a href="#">Art Gallery</a></li>
    <li><a href="#">Contact Jan Kardys</a></li>
</ul>
</div>
<div id="Page_Content">
<div id="Main_content">Content for id "Main_content" Goes Here</div>
<div id="xtra_content"><h3>News & Events
    </h3>
    <p><a title="http://scotlandpubliclibrary.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://scotlandpubliclibrary.org/">Scotland Public Library</a>, Scotland, CT April 21, 2011 6-8pm<br />
</p>
    <p><a title="http://www.plymouthct.us/library.htm" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://www.plymouthct.us/library.htm">Plymouth CT Library</a>, Plymouth, CT April 30, 2011 10am<br />
    </p>
    <p><a title="http://www.hplct.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://www.hplct.org/">Hartford Public Library</a>, Hartford, CT May 7, 2011 10am<br />
    </p>
    <p><a title="http://www.middleburghlibrary.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://www.middleburghlibrary.org/">Middleburgh Library</a>, Middleburgh, NY May 14, 2011 1pm<br />
    </p>
    <p><a title="http://dewlib.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://dewlib.org/">Dewitt Community Library</a>, Dewitt, NY June 21, 2011 7pm<br />
    </p>
    <p><a title="http://gilfordlibrary.org/gpl/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://gilfordlibrary.org/gpl/">Gilford Public Library</a>, Gilford, NH July 7, 2011 6:30-7:30pm<br />
    </p>
    <p><a title="http://www.athollibrary.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://www.athollibrary.org/">Athol Public Library</a> Athol, MA July 14, 2011 5:30pm<br />
    </p>
    <p><a title="http://www.goshenpublib.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://www.goshenpublib.org/">Goshen Public Library</a> Goshen, CT July 23, 2011 11am<br />
    </p>
    <p><a title="http://columbiactlibrary.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://columbiactlibrary.org/">Saxton B. Little Free Library</a>, Columbia, CT July 26, 2011 6:45pm<br />
    </p>
    <p><a title="http://hampden-library.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://hampden-library.org/">Hampden Public Library</a>, Hampden, MA Sept. 10, 2011 10:30am<br />
    </p>
    <p><a title="http://fortlee.bccls.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://fortlee.bccls.org/">Fort Lee Public Library</a>, Fort Lee, NJ Sept. 14, 2011 7:00pm<br />
    </p>
    <p><a title="http://prosserlibrary.info/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://prosserlibrary.info/">Prosser Public Library</a>, Bloomfield, CT October 3, 2011 6:00-8:00pm<br />
    </p>
    <p><a title="http://iwwg.org" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://iwwg.org">IWWG. org</a>, New York City, October 16, 2011 2:30-6pm<br />
    </p>
    <p><a title="http://www.hchlibrary.org/" onkeypress="window.open(this.href); return false;" onclick="window.open(this.href); return false;" href="http://www.hchlibrary.org/">Henry Carter Hull Library</a>, Clinton, CT October 24, 2011 6:30pm<br />
    </p>
    <p><a href="http://town.canton.ma.us/library" title="http://town.canton.ma.us/library">Canton Public Library</a>, Canton MA Janurary 7, 2012 2:00pm<br />
    </p>
    <p><a href="http://www.town.sturbridge.ma.us/Public_Documents/F0000F86A/library" title="http://www.town.sturbridge.ma.us/Public_Documents/F0000F86A/library">Joshua Hyde Library</a>, Sturbridge, MA March 24, 2012 10:30am<br />
    </p>
    <p>Otis Library Norwich, CT April 14, 2012 12:00am-2:00pm<br />
    </p>
</div>
</div>
<div id="footer"> <h6>Webpage designed by James S. Molina</h6></div>
<script type="text/javascript">
var MenuBar1 = new Spry.Widget.MenuBar("Vertical_menubar", {imgRight:"/SpryAssets/SpryMenuBarRightHover.gif"});
</script>
</div></body>
</html>

In regard to the files you currently have on your server, the links to your Spry menu files are still pointing to your local computer. This is caused when a site has not yet been defined in Site Manager, so DW is forced to link them locally.
To fix your page, just go into code view and remove the part of the link path that I have underlined and made BOLD.
<script src="file:///C|/Users/james/Documents/DREAMWEAVER SITES/SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="file:///C|/Users/james/Documents/DREAMWEAVER SITES/SpryAssets/SpryMenuBarVertical.css" rel="stylesheet" type="text/css" />

Spry Menu Background image not working in IE

I have created a website using Dreamweaver CS5 and having trouble with my Spry bar in internet explorer. It looks great in chrome, firefox, etc, but in IE there is a white background instead of my background image and the submenus have moved WAY right.. can someone help me!
SpryMenuBarHorizontal.CSS is below:
@charset "UTF-8";
/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
/* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
LAYOUT INFORMATION: describes box model, positioning, z-order
/* The outermost container of the Menu Bar, an auto width box with no margin or padding */
ul.MenuBarHorizontal
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
cursor: default;
width: 800px;
/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
ul.MenuBarActive
z-index: 1000;
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: center;
cursor: pointer;
width: 160px;
float: left;
background-image: url(file:///E|/MAIN_website/images/menu_background.jpg);
ul.MenuBarHorizontal li a{
color:#FFF;
ul.MenuBarHorizontal li li{
background-image: url(../images/menu_background1.jpg);
ul.MenuBarHorizontal li li a{
color:#000;
ul.MenuBarHorizontal li li li{
background-image: url(file:///E|/MAIN_website/images/index_06.jpg);
ul.MenuBarHorizontal li li li a{
color:#FFF;
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover,
ul.MenuBarHorizontal a.MenuBarSubmenuVisible{
color:#33CCFF;
/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
ul.MenuBarHorizontal ul
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 8.2em;
position: absolute;
left: -1000em;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
left: auto;
/* Menu item containers are same fixed width as parent */
ul.MenuBarHorizontal ul li
width: 160px;
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
left: auto;
top: 0;
DESIGN INFORMATION: describes color scheme, borders, fonts
/* Submenu containers have borders on all sides */
ul.MenuBarHorizontal ul
border: 1px solid #CCC;
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
padding: 0.5em 0.75em;
color: #FFF;
text-decoration: none;
font-family: Cambria, Arial, sans-serif;
font-size: 14px;
/* Menu items that have mouse over or focus have a blue background and white text */
ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
color: #FFF;
text-decoration: underline;
/* [disabled]background-image: url(file:///E|/MAIN_website/images/menu_background.jpg); */
/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
background-color: #33C;
color: #FFF;
SUBMENU INDICATION: styles if there is a submenu under a given menu item
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenu
background-image: url(SpryMenuBarDown.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
background-image: url(SpryMenuBarRight.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarDownHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
background-image: url(SpryMenuBarRightHover.gif);
background-repeat: no-repeat;
background-position: 95% 50%;
BROWSER HACKS: the hacks below should not be changed unless you are an expert
/* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
ul.MenuBarHorizontal iframe
position: absolute;
z-index: 1010;
filter:alpha(opacity:0.1);
/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
@media screen, projection
ul.MenuBarHorizontal li.MenuBarItemIE
display: inline;
f\loat: left;
background: #FFF;

Because I can't see your site and code in context, I will make a guess that this style is throwing off your alignment:
/* Menu item containers, position children relative to this container and are a fixed width */
ul.MenuBarHorizontal li
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
position: relative;
text-align: center;
cursor: pointer;
width: 160px;
float: left;
background-image: url(file:///E|/MAIN_website/images/menu_background.jpg);
Remove the text-align:center; from the above style.
Instead of centering your list element (li), center the link text (a) itself:
/* Menu items are a light gray block with padding and no text decoration */
ul.MenuBarHorizontal a
display: block;
cursor: pointer;
padding: 0.5em 0.75em;
color: #FFF;
text-align: center;
text-decoration: none;
font-family: Cambria, Arial, sans-serif;
font-size: 14px;
If you don't want the submenu text to be centered, do this immediately after the previous style:
ul.MenuBarHorizontal ul a {text-align: left;}
The sub-submenus are also set up by default to be jogged a bit to the right. You can adjust this style:
/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
ul.MenuBarHorizontal ul ul
position: absolute;
margin: -5% 0 0 95%;
that causes sub-submenus to fly out to the right of the submenus to which they attach.
Submenus themselves (not the sub-submenus) should fall directly under the top menu item by default, once you remove the text-align: center; on the li item (above).
Beth

Problem in setting background Image to TabedPane.

Hi Pals,
I created a JFrame which consist of some components. The structure of the added components are given below.
1) I added a JPanel (MainPanel) with background image in a JFrame.
2) I added a JTabbedPane with 7 tabs in the previous JPanel (MainPanel).
3) Each tabs in the JTabbedPane having JPanel with Background Image.
This is my Frame Structure. but i haven't problem to run in JDK1.6,1.5. It is working perfect. But when am run in lower version like 1.3 or 1.4. The design is looking bad. The JTabbedPane overlap the (MainPanel). The background image of the (MainPanel) was hided. I set setOpaque(false) for the JTabbedPane. But it also not working. How can i solve this problem.
By,
Mohan

Your problems appear to stem from your choice of layout manager(s). To get better help sooner, post a [_Short, Self Contained, Compilable and Executable, Example Program (SSCCE)_|http://mindprod.com/jgloss/sscce.html] that clearly demonstrates your problem.
To post code, use the code tags -- [code]Your Code[/code] will display asYour CodeOr use the code button above the editing area and paste your code between the {code}{code} tags it generates.
db

Background Image in Spry Menu

Hi everyone,
I'm really struggling with this Spry Horizontal Menu thing. I tried to read thru some other people's duscussions but I got lost.
I just want to add a gradient image instead of a plain color background. Now, I did achieved that on the main level items but as soon as I add submenus, the background image dissapear from the main items and shows on the submenus. That's it. I hope this is easy enough to fix.
I'm not that familiar with CSS and by looking at some samples, the CSS code is embedded in the same HTML page where the menu bar is. Isn't supposed to be on it's own CSS page? And one more thing, can the horizontal menu be inside a table? And if not, how can I center it on the page?
I'm a beginner so please be gentle... : )
Thanks

This is good but my problem is that my background image dissapear from the main menu item as soon as I add a submenu item... everything else seems to work just fine. About the question if the menu could go inside a table or if has to be out side of it, how can I centered it on the page?
thx

Background images look rough

Similar Messages

Maybe you are looking for