Centering images

Definition of poetry (2) centering images?

It's a solid proposal to prefer in many cases, adopt the good tradition of the Center (horizontally) the images on the pages, where the margins do not play their role dominating. The new margins or (now) spaces, are the same in both sides and related to the left and right word nearest the beginning and end of lines. And variable all the time.

Perhaps the reason behind this is that whitespace is applied democratically, with the result a text floating on (poem), producing a superb presence centered on the page.

I tried to implement an automatic process rather than drag the right side to the left until it is perfectly adapted to the long line and later centering on the page, fortunaly using smart guides. But this hand process is just a waste of time.

InDesign has a tool to vertically fix the framework (framework to adapt to the content), but it does not work horizontally.

It is scriptable?

BSD

CentrePoetry
An InDesign CS4 JavaScript
Select the lines to be worked. Run the script.
The lines will then focus on the longest line of the selection
mylines = app.selection [0] .lines.
AA = 0;
longestline = 0;
for (cc = 0; cc
mylines [cc] .justification = Justification.LEFT_ALIGN;
.leftIndent mylines [cc] = 0;
If (mylines [cc] .characters [-1] .horizontalOffset > longestline) {}
longestline = mylines [cc] .characters [-1] .horizontalOffset;
AA = cc;
}
}
mylines [aa] .justification = Justification.CENTER_ALIGN;
myInfoX = mylines [aa] .horizontalOffset;
myFrameEdge = mylines [aa] .parentTextFrames [0] .geometricBounds [1];
myInfoX = myInfoX - myFrameEdge;
mylines [aa] .justification = Justification.LEFT_ALIGN;
for (cc = 0; cc
mylines [cc] .leftIndent = myInfoX;
}

Firefox is visualization of images such as a mobile device.

My firefox is visualization of images as a mobile device, with a black background and the centered image. I do not like that and go back to la I've had before.

With Firefox 11, which has introduced to improve the visibility of the images seen. You can install the https://addons.mozilla.org/en-US/firefox/addon/old-default-image-style/, that will make all the images to display, as they did before.

How to center an Image?

It has been easy to center an image, but not more. I don't know ANYTHING about CSS then please tell me to step 1 How do.

I created a simple blank html page and inserted a picture inside. I looked in properties but nothing say CSS appears. If at this stage, how do I focus?

OK, first click on the image. then, at the bottom left of the menu properties, you should see a small thumbnail of your image and Word ID with an input field.  Provide a name for this image.  then right click on the enlarged image. Click on css > styles > new a new quick menu will appear.  in this menu, it reads... Choose a type of contextual selector... from the dropdown choose ID (applies to a single HTML element);  then from the selector name: drop-down list select the name of your ID. And then click OK. Now, we have a rule defined for this image. now find category block.  where it says display right with a dropdwn box, choose block; Then click on the box and fill in height and the appropriate width.  then click on apply, then ok.  Now back to our view of design should be a tab that indicates the properties we've added now. The mine is located on the right side of my work space.  It shows display: block; Width: 100px in height of 100px and lower than then said to add the property.  Click on it and add margin and her and then press ENTER.  for its value, specify auto, and then you should have a centered image.

Text on the background image

I have a page that I used "opacity" to clarify the background image, but it has also reduced the text. And I want the background behind the text centered image.

Here is the page that I need help: http://www.healthquestpt.com/hpc/purpose.html

Here's how I want it to look: http://www.healthquestpt.com/homephysiciancare/purpose.html

Here is the css code:

#purpose

{

float: left;

left margin: 35px;.

top of the margin: 50px;

margin-bottom: 40px;

Width: 287px;

height: 403px;

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

opacity: 0.666667;

Filter:alpha(opacity=66);

}

Thanks for your help!

Right.  Opacity CSS effects everything inside the container.

For a simple solution, use a mosaic of image semi-transparent.png as your background image.

Nancy O.

Center an image in Dreamweaver

I am new Dreamweaver CS4 and CSS, despite several years of design based on tables layouts on the Front Page. I put a lot of time in training to understand the box model and I am making progress. I created basic 2 columns, either from zero (no model) with a header, a left sidebar, a main content area, and a footer. And with floats fitted, everything works fine.

I'm running a problem with what I thought would be the easiest of tasks. Inside the main content div, I want a centered image followed below any copy of paragraph, which will be controlled by its own CSS rule. Probably missing me something obvious, but I can't for the life of figure me out how to center the image. In the cover Page, you selected the image and clicked on a 'Center' button - simple enough. But far from manually edit HTML with < center > < / center > tags, I have not "see an option to center an image.

I searched here and found some answers that were not exactly the same situation, or I did not quite understand. Of course, I would be happy if someone can help me in this task without showing too much impatience with my ignorance.

Unfortunately, this is a thread very old and answers provided 6 years ago are out of words and outdated today.

In the "bootstrap" documents, use the classes in centering incorporated.

In other documents, use a custom CSS class.

.logo {display: block; width: auto; auto margin: 0}

class = "logo" src = "your_logo.jpg" alt = "logo of xyz" > "

Nancy O.

text-align: center in div with images and text

It works fine in all browsers.

Canon, in the face of fast moving subjects 18-55 kit lens?

Hi everyone, I'm new here.

I was doing one shoot the other day on very fast subjects that changed a lot of direction (dogs). Got some good shots but the vast majority were evil out of the home, which was a real shame. I want to know if it's the lens, the body or my technique that does not reach me.

I'm relatively new to photography, so maybe it's that my settings are wrong or my technique is bad. I'm using the lens wide open, not mode live view with servo AF on a 600 d body. Usually when I focus I pan just the camera turn to follow the subject, sometimes pressing down when I want to shoot.

I plan the upgrade to the 17-55 f2.8 because it is sharp wide open and has a constant and fast opening and USM and full-time manual focus with a correct focus ring.

Thank you.

Your problems are probably due to a combination of factors. IMO, auto focus performance is determined by three things...

1. camera AF capabilities. Your 600 d has 9 AF points system. Only one of these points - the center one - is the "best" type of cross that is more responsive and follows the movement better. When shooting moving subjects with your camera, it would be useful to limit yourself to using only the central point. (Note: other Canon cameras have more advanced systems of the AF.) T4i, T5i, 60 d, 50 d and 40 d has 9 AF points that looks like, but all nine points are the cross-type sesnors 'better '. The 7 d and 70 d AF 19 points, with all of the nineteen cut type. 5DIII and 1DX 61 points AF with up to 41 Cup type, depending on the lens used.)

Some cameras are also optimized for performance development. For example, the models of the series 1 d and 7 d have a separate chip driving AF... While most (maybe all?) other models share the tasks of AF by the same processor that handles images.

2 capacity autofocus lens: Yes, a reader of "USM" (Ultrasonic Motor) objective as the EF-S 17 - 55 / 2.8 would be an improvement on your kit lens. It is faster, less hunting and is quieter than a 'micro' such as is used in the cheaper kit lens. (Note: there is a version a bit more of the 18-55mm with drive focus "STM" or "Stepper motor", which is better than the micro motor version, but still not as fast as USM.) STM lenses are running silent and particularly well suited for video.)

A larger aperture, like the 17-55 / 2.8 (as opposed to your 18-55/3.5-5.6), offers more light to the camera AF sensors, allowing for faster and better follow-up.

No, forget all the EF 50/1.8... Of course, he got more openness, but it uses a micro motor and is widely known to be developed slower, less accurate and likely to hunt more than a USM lens. If you want a quick and of course focusing in short and medium telephoto, look to the EF 50/1.4, 85/1.8, 100/2 or L-135/2 lenses. These all use USM drive and are much faster and more accurate than the EF 50/1.8. They have also one or two larger max aperture stop that even the 17-55 / 2.8 (or any other zoom lens), provide more light for the camera to work with. Using a f2.8 lens or "faster" will give optimal performance on your camera, with the centre of focus.

A few drinks simply are not designed to be developed fast, even if they have more large openings and USM focus. Macro lenses, for example, have to move their focus group a long, long way to go from infinity to 1:1 magnification tends to be slower. In addition, very large aperture lenses such as the 85 / 1.2 L are generally slower... Design. Very large aperture lenses and macro focus on precision, to deal with the shallow depth of the effects on the ground, rather than speed.

Other objectives are designed to the very fast development. All 70-200, the 100-400 and all the first 300mm lenses and more, are quite fast focusing. Extreme telephotos such as 500 and 600 mm can be difficult to get and keep on target, however.

Some third-party lenses also make use of similar to Canon's USM development drive, to help the performance of the update. Sigma HSM and Tamron lenses USD are examples.

3. skills of the user is the third key factor making the update performance... that is, your technique.

You mention servos 'AF '...  Just to clarify, yourcamera has three focus modes: one-shot, HAVE Focus and AI Servo... There is no "Servo AF. The correct mode to use with moving subjects is AI Servo. Perhaps what you are already doing. In any case, One Shot is almost only used with stationary subjects (there are techniques of 'pre-focus' where it can be used with moving subjects, but those who are rarely used). I Focus is not really a foucs mode at all... It is supposed to decide for you, if the subject is moving, then change to use the correct mode. I have not tested on a recent, but older model where I tried, I found a slight delay that causes a lot of discussion missed shots. He also simply chose the wrong mode sometimes. It might be interesting to note that Canon more pro-oriented models have same AI Focus... they offer only One Shot or AI Servo.

So, make sure that you are using AI Servo to maximize performance when shooting moving subjects.

You also use a slow shutter speed. I inflate the ISO and try to use 1/500 or faster shutter speeds. 1/320 or 1/400 is very marginal, trying to stop the movement of the subject with something as fast as the dogs in action. In fact, more you are close to the subject, shutter speed more fast you will really need to freeze movement.

Cannon also noted that the 18MP models are a little prone to blur shake camera - probably because of the high density of pixels on the sensor sites - and recommends keeping shutter speeds upwards to be sure to get a sharp shot, even with IS lenses. There was a white paper on this subject, on the Canon website. I don't know if it is still available online.

You should be able to get nice images, specific to ISO 1600... a complete stop of two higher and you to use much faster shutter speed. However, if the indoor shooting it may be areas that are not as well informed and are hard to get a sharp shot.

You can shoot RAW files, so that you can more fully control noise reduction and factors in post-processing exposure when using high ISO.

A popular technique among photographers of sports/action is back button to the point. See this article online, on this subject: http://www.learn.usa.canon.com/resources/articles/2011/backbutton_af_article.shtml

BBF separates the function of the development of the trigger. You use rather your thumb on one of the rear camera buttons to start and stop the development. Many users feel that this allows more safe and followed acquistion with moving subjects. You can configure your camera for BBF and give it a try. It is possible for action/sport/HAVE Servo shooting, it's actually usable once, too... I used it enough only for a few years now.

With the help of BBF, I start AF well before that I want to take the picture, then focus on the maintenance of the area to focus on the right of the subject where I want the lens to focus continuing to follow and maintain the emphasis... then take pictures along the way. I use the Center Focus point alone, much of the time. This could lead to too centered images, so I try to fit a little loose from time to time, allowing cropping to make that fewer centered images. I sometimes use other than the Center AF point... but who wouldn't recommend with action shot on a camera that does not have the type sensors crossed to peripheral issues, such as your 600 d.

I use a pair of 7Ds and a number of USM lenses fast development of shoot a lot of sports. With a few years of practice under my belt, on avearage I nail focus on 95 to 98 on 100 shots using this type of gear with the above techniques. I turned to 4000 images at an event recent and marked about 30 people like "rejected" to missed focus problems (and I bet at least half of those who are my fault... not the machine). There may be a few others that are marginally acceptable (i.e., can make an 8 x 10 beautiful print, but seem not good any more greater than). Yet, even if there are 80 or 120 spleen focus, it is only 2 or 3%... much better than only 10% in short.

I would say that qualities of objective performance and user techniques generally count more than the camera well, or at least can largely compensate for any camera shortcomings. I got results almost as good 50 d and 30 d before it (which were similar to your 600 d AF system) and even with 10 days earlier ("lower" than your AF system). Although I'm a bit away, I didn't like good luck shooting moving subjects using 5 d Mark II (I mostly just use it for stationary subjects)... the 5 d Mark III has a much better AF system and follows the movement much better.

I hope this helps!

***********
Alan Myers

San Jose, California, USA.
«Market softly and carry a great lens.»
MATERIAL: 5DII, 7D(x2), 50D(x3), some other cameras, various lenses & accessories
FLICKR & REPROGRAPHY

Layout and properties on the created dynamically containers

I want to show multiple rows of tiles (3 x 2 on portrait, 2 x 3 on the landscape or square screen).

I have a ComponentDefintion for a line which is a container with StackLayout LeftToRight. To this, I add the tiles.

And the ComponentDefintion of the slab:

ComponentDefinition {
  id: tileDefinition
  Container {
     id: tileContainer
     property string imagePath
     property string hexColor
     onHexColorChanged: {
       background = Color.create(hexColor);
     }
     leftPadding: 15
     Container {
       layout: DockLayout {
     }
     ImageView {
       imageSource: tileContainer.imagePath
       id: tileImageView
       verticalAlignment: VerticalAlignment.Center
       horizontalAlignment: HorizontalAlignment.Center
     }
   }
  }
}

the container is created correctly, but the background and the value of the image.

However, the leftPaddig is ignored, and the imageview is not centered.

Quite strange, the line has 15 topPadding displayed correctly.

I tried to define the available dynamically using a DockLayout ComponentDefinition, but that is not the case.

Any ideas how to get the centered image and the successfully added leftPadding?

I solved the problem, the layout works very well if I give the outside container size by first using HorizontalAlignment.Fill, VerticalAlignment.Fill and StackLayoutProperties with spaceQuota: 1.0

the QML are sometimes mysterious

effective horizontal lists with scroll

Hello

I have a group of images which I want to display in a horizontal list, the size of the list will vary depending on what option a user selects.

However, I'm not sure of the best way to implement a list if I have a large number of images to provide an it, therefore generating a lot of areas that need to be drawn.

My idea of making the effective list:

-Store the images in a circular table.

-Display the first 3 images on the screen in3 views that are visible to the user (for example <-- img1=""  ="" img2=""  ="" img3="" --="">)

-Keep a record of what is exposed...

-When a user scrolls left or right the next/previous image in the table is displayed.

For example scrolling right once will give me ( <--  img2=""  img3="" img4="" --="">)

For example scrolling left 3 times from the point above will give me ( < --="" img(n-1)=""  img(n)=""  img1="" --=""> )

and so on...

What would be the best way to do what above, or are there better ways?

I would be grateful if someone could direct me to the relevant documentation, methods of the api should I use as well.

Is there already a method in the api that can recycle the views in the same way...?

I would be grateful for any help.

Thanks in advance.

Answer:

PictureScrollField:

"A slider component that draws a line of images that can be the object of one scroll from side to side using the trackball or touch gestures. The images drag horizontally to align the focus vertically centered image. Images decelerate they approach their new position to give a lively effect. There are also several configurable effects to highlight the image update.

All images are awarded the same amount of space on the cursor (as defined by imageWidth of the manufacturer and the imageHeight settings). Images may differ from this size, in which case the scroll field behaves as follows:

Images are NOT resized. If they are larger than the allocated drawing area they are center aligned and cropped to fit the allotted area. If it is smaller than the drawing area allocated, they are centered in the allocated area. »

From: BlackBerry API 5.0.0

Stop the submenu spry showing before hovering.

Hi, still green it. Construction Deamweaver CS6. Make a spry menu nav top of the page. But seems to have the stuck spry opened before even the hover takes place all the time. Its driving me crazy.  have tried a lot and can't see that the CSS, I need to change hidden instead of visible or none instead of block. When I hide, all superior nav is hidden.

Help, please. You will need to adjust this to allow then to use this model and push on with other pages that my site is inaccessible, eek!

Thanks in advance.

(Oh yes, and the top of the nav page did something funky, just looked.) Still in the studio, just downloaded and it jumping everywhere.

(and Yes, it's a gif in the Middle I had, just like the establishment until I decide to whay kind of see the real I want).

Site:

Ablaze Design

Source code:

< ul id = "Menu bar" class = "MenuBarHorizontal" >

< li >

" < div align ="center"> < a class ="MenuBarItemSubmenu' href = ' http://www.ablazedesign.co.uk/about "> ON < /a > .

< / div >

< /li > < li >

" < div align ="center"> < a class ="MenuBarItemSubmenu' href = ' http://www.ablazedesign.co.UK/stationery "> < /a > stationery .

< ul >

" < li > < a href =" http://www.ablazedesign.co.UK/collection "> COLLECTION < /a > < /li > .

" < li > < a href =" http://www.ablazedesign.co.UK/bespoke "> custom < /a > < /li > .

" < li > < a href =" http://www.ablazedesign.co.UK/order "> ORDER < /a > < /li > .

" < li > < a href =" http://www.ablazedesign.co.UK/inspiration "> INSPIRATION < /a > < /li > .

< /ul >

< / div >

< /li > < li >

" < div align ="center"> < a class ="MenuBarItemSubmenu' href = ' http://www.ablazedesign.co.UK/design "> < /a > design .

< / div >

< /li > < li >

" < div align ="center"> < a class ="MenuBarItemSubmenu' href = ' http://www.ablazedesign.co.UK/I Love "> I you LOVE < /a > < / div > "

< /li >

< li >

" < div align ="center"> < a href =" http://www.ablazedesign.co.UK/kind Words "> KIND WORDS < /a > < / div > "

< /li >

< li >

" < div align ="center"> < a href =" http://www.ablazedesign.co.uk/contact "> CONTACT < /a > < / div > .

< /li >

Sections:

@charset "UTF-8";

/ * Sections - version 0.6 - Pre - Release Spry 1.6.1 * /.

/ * Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/*******************************************************************************

The AVAILABLE INFORMATION: Describes the box model, positioning, the order

*******************************************************************************/

/ * The outermost container for the menu bar, an area of width auto without margin or padding * /.

UL. MenuBarHorizontal

{

margin: 0 auto;

padding: 0;

list-style-type: none;

do-size: 100%;

Width: auto;

}

/ * Value of the menu bar active with this class, currently the definition of z-index to accommodate IE rendering bugs: http://therealcrisp.xs4all.nl/Meuk/IE-zindexbug.html */

UL. MenuBarActive

{

z-index: 1000;

}

/ * Menu item containers, position of children relative to this container and are a fixed width * /.

UL. MenuBarHorizontal li

{

padding: 0;

list-style-type: none;

do-size: 100%;

position: relative;

text-align: left;

Width: 160px;

float: left;

background-position: Center;

margin-top: 0;

margin-right: auto;

margin-bottom: 0;

left margin: auto;

}

/ * Submenus should appear under their parent (top: 0) with a higher z-index, but they are first the left side of the screen (-1000em) * /.

UL. MenuBarHorizontal ul

{

margin: 0;

padding: 0;

list-style-type: none;

do-size: 100%;

z index: 1020;

Width: 160px;

position: absolute;

left: 0px;

top: 34px;

}

/ * Submenu that shows with the designation of the class MenuBarSubmenuVisible, we put the car left so it happens on the screen below its parent menu item * /.

UL. MenuBarHorizontal

{

}

/ * Container of menu items are same fixed width parent * /.

UL. MenuBarHorizontal ul li

{

Width: 160px;

text-align: center;

}

/ * Submenus should appear slightly overlapping to the right (95%) and upward (-5%) * /.

UL. MenuBarHorizontal ul ul

{

position: absolute;

margin:-5% 0 0 95%;

}

/ * Submenu that shows with the designation of the class MenuBarSubmenuVisible, we have left to 0, it is on the screen * /.

UL. MenuBarHorizontal

{

left: auto;

top: 0;

}

/*******************************************************************************

INFORMATION DESIGN: Describes the set of colors, borders, fonts

*******************************************************************************/

/ * Submenu containers have borders on all sides * /.

UL. MenuBarHorizontal ul

{

border:;

}

/ * Menu items are a light grey block with padding and no text decoration * /.

UL. MenuBarHorizontal a

{

display: block;

background-color: #FFF;

Padding: 0.5em 0.75em;

color: #999999;

letter-spacing: 2px;

text-decoration: none;

text-align: Center;

}

/ Components menu that have mouse over or focus have a blue background and white text * /.

UL. MenuBarHorizontal a: hover, ul. MenuBarHorizontal a: focus

{

background-color: #FFF;

color: #FFF;

display: none;

text-align: center;

}

/ * Menu items that are opened with the submenus are on MenuBarItemHover with a blue background and white text * /.

UL. MenuBarHorizontal a.MenuBarItemHover, ul. MenuBarHorizontal a.MenuBarItemSubmenuHover, ul. MenuBarHorizontal a.MenuBarSubmenuVisible

{

background-color: FCC;

color: #FCC;

text-align: center;

}

/*******************************************************************************

Submenu INDICATION: styles if there is a submenu in a given category

*******************************************************************************/

/ * Menu items that have a submenu have the MenuBarItemSubmenu class designation and are set to use a positioned background the far left (95%) and vertically centered image (50%) * /.

UL. MenuBarHorizontal a.MenuBarItemSubmenu

{

background-image: url (SpryMenuBarDownHover.gif);

background-repeat: no-repeat;

background-position: 50 95%;

}

/ * Menu items that have a submenu have the MenuBarItemSubmenu class designation and are set to use a positioned background the far left (95%) and vertically centered image (50%) * /.

UL. MenuBarHorizontal ul a.MenuBarItemSubmenu

{

background-image: url (SpryMenuBarRight.gif);

background-repeat: no-repeat;

background-position: 50 95%;

{Display: none;}

}

/ * Menu items that are opened with the submenus have the designation of the MenuBarItemSubmenuHover class and are set to use a background image "hover" positioned on the far left (95%) and centered vertically (50%) * /.

UL. MenuBarHorizontal a.MenuBarItemSubmenuHover

{

background-repeat: no-repeat;

background-position: 50 95%;

}

/ * Menu items that are opened with the submenus have the designation of the MenuBarItemSubmenuHover class and are set to use a background image "hover" 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: 50 95%;

}

/*******************************************************************************

BROWSER HACKS: hacks below should not be changed, unless you are an expert

*******************************************************************************/

/ * HACK FOR IE: to ensure that sub menus show above form controls, underpin us each submenu with an iframe * /.

UL. MenuBarHorizontal iframe

{

position: absolute;

z index: 1010;

Filter:alpha(opacity:0.1);

}

/ * HACK FOR IE: to stabilize the appearance of the menu items. the slash in the float is to keep IE 5.0 analysis * /.

@media screen, projection

{

UL. MenuBarHorizontal li. MenuBarItemIE

{

display: inline;

float: left;

Background: #FFF;

}

}

I realize Spry is always in your version of DW, but abandoned Adobe Spry end of 2012 because he is not mobile friendly.  It was extracted from DW CC in 2013 and replaced with jQuery UI.

https://jQueryUI.com/menu/

If you want professional results & have a budget to work with, I can recommend this commercial expansion of the seven project.  It is reactive and touch the screen of the environment.  BTW, I have no affiliation with PVII except as a user of the product.

Pop-Menu Magic3 of PVII (commercial extension of DW)

http://www.Projectseven.com/products/menusystems/pmm3/index.htm

Good luck with your project.

Nancy O.

Menu Spry missing first submenus, but showing only the last.

Hello, I'm doing a site for a school project and I have a spry menu code that looks good, but when it is turned on, when you move the menu, submenus are empty except for the last.

Here's what it looks like on a mode live view:

Above war-torn project are three submenus. They have the text, but will not appear. My other menus do the same thing. For personal reasons, I will not not to publish the entire site because of his real name, address, contact, etc.

I'll post the menu spry and css menu spry.

Spry menu:

< div class = "container" >

< div class = "NavigationBar" >

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

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

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

< li > < a class = "MenuBarItemSubmenu" href = "#" > < /a > ongoing projects

< ul >

< li > < a class = "MenuBarItemSubmenu" href = "Film.html" > < /a > Film

< ul >

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

< li > < a href = "#" > Japan 2016 < /a > < /li >

< /ul >

< /li >

< li > < a href = "Photography.html" > photography < /a > < /li > ""

< li > < a href = "Story.html" > stories < /a > < /li > ""

< li > < a href = "Project_Wartorn.html" > project: torn apart by the war < /a > < /li > ""

< /ul >

< /li >

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

< /ul > < hr / >

<! - end .header - > < / div >

< div class = "content" >

Spry CSS menu:

@charset "UTF-8";

/ * Sections - version 0.6 - Pre - Release Spry 1.6.1 * /.

/ * Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */

/*******************************************************************************

The AVAILABLE INFORMATION: Describes the box model, positioning, the order

*******************************************************************************/

/ * The outermost container for the menu bar, an area of width auto without margin or padding * /.

UL. MenuBarHorizontal

{

padding: 0;

list-style-type: none;

font size: 20px;

cursor: default;

Width: 921px;

height: 30px;

background-color: #333;

do-family: "Arial Black", Gadget, without serif.

text-align: center;

margin-top: 0;

right margin: 15px;

margin-bottom: 0;

margin left: 19px;

}

/ * Value of the menu bar active with this class, currently the definition of z-index to accommodate IE rendering bugs: http://therealcrisp.xs4all.nl/Meuk/IE-zindexbug.html */

UL. MenuBarActive

{

z-index: 1000;

}

/ * Menu item containers, position of children relative to this container and are a fixed width * /.

UL. MenuBarHorizontal li

{

padding: 0;

list-style-type: none;

do-size: 100%;

position: relative;

text-align: left;

cursor: pointer;

Width: 230px;

float: left;

height: 15px;

margin: 0;

}

/ * Submenus should appear under their parent (top: 0) with a higher z-index, but they are first the left side of the screen (-1000em) * /.

UL. MenuBarHorizontal ul

{

margin: 0;

padding: 0;

list-style-type: none;

do-size: 100%;

z index: 1020;

cursor: default;

Width: 8.2em;

position: absolute;

left:-1000em;

}

/ * Submenu that shows with the designation of the class MenuBarSubmenuVisible, we put the car left so it happens on the screen below its parent menu item * /.

UL. MenuBarHorizontal ul. MenuBarSubmenuVisible

{

left: auto;

}

/ * Container of menu items are same fixed width parent * /.

UL. MenuBarHorizontal ul li

{

Width: 8.2em;

}

/ * Submenus should appear slightly overlapping to the right (95%) and upward (-5%) * /.

UL. MenuBarHorizontal ul ul

{

position: absolute;

margin:-5% 0 0 95%;

}

/ * Submenu that shows with the designation of the class MenuBarSubmenuVisible, we have left to 0, it is on the screen * /.

UL. MenuBarHorizontal ul. MenuBarSubmenuVisible ul. MenuBarSubmenuVisible

{

left: auto;

top: 0;

}

/*******************************************************************************

INFORMATION DESIGN: Describes the set of colors, borders, fonts

*******************************************************************************/

/ * Submenu containers have borders on all sides * /.

UL. MenuBarHorizontal ul

{

border: 1px solid #CCC;

}

/ * Menu items are a light grey block with padding and no text decoration * /.

UL. MenuBarHorizontal a

{

display: block;

cursor: pointer;

background-color: #333;

color: #393;

text-decoration: none;

Width: auto;

padding-top: 0.5em;

padding-right: 0.75em;

padding-bottom: 0.5em;

padding-left: 0.75em;

}

/ Components menu that have mouse over or focus have a blue background and white text * /.

UL. MenuBarHorizontal a: hover, ul. MenuBarHorizontal a: focus

{

background-color: # 33;

Color: #333;

}

/ * Menu items that are opened with the submenus are on MenuBarItemHover with a blue background and white text * /.

UL. MenuBarHorizontal a.MenuBarItemHover, ul. MenuBarHorizontal a.MenuBarItemSubmenuHover, ul. MenuBarHorizontal a.MenuBarSubmenuVisible

{

background-color: #F0F0F0;

Color: #333;

Width: auto;

}

/*******************************************************************************

Submenu INDICATION: styles if there is a submenu in a given category

*******************************************************************************/

/ * Menu items that have a submenu have the MenuBarItemSubmenu class designation and are set to use a positioned background the far left (95%) and vertically centered image (50%) * /.

UL. MenuBarHorizontal a.MenuBarItemSubmenu

{

background-image: url (SpryMenuBarDown.gif);

background-repeat: no-repeat;

background-position: 50 95%;

}

/ * Menu items that have a submenu have the MenuBarItemSubmenu class designation and are set to use a positioned background the far left (95%) and vertically centered image (50%) * /.

UL. MenuBarHorizontal ul a.MenuBarItemSubmenu

{

background-image: url (SpryMenuBarRight.gif);

background-repeat: no-repeat;

background-position: 50 95%;

}

/ * Menu items that are opened with the submenus have the designation of the MenuBarItemSubmenuHover class and are set to use a background image "hover" 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: 50 95%;

}

/ * Menu items that are opened with the submenus have the designation of the MenuBarItemSubmenuHover class and are set to use a background image "hover" 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: 50 95%;

}

/*******************************************************************************

BROWSER HACKS: hacks below should not be changed, unless you are an expert

*******************************************************************************/

/ * HACK FOR IE: to ensure that sub menus show above form controls, underpin us each submenu with an iframe * /.

UL. MenuBarHorizontal iframe

{

position: absolute;

z index: 1010;

Filter:alpha(opacity:0.1);

}

/ * HACK FOR IE: to stabilize the appearance of the menu items. the slash in the float is to keep IE 5.0 analysis * /.

@media screen, projection

{

UL. MenuBarHorizontal li. MenuBarItemIE

{

display: inline;

f\loat: left;

background-color: #333;

}

}

I guess you have your SpryAssets responsible, including the javascript file concerning it. Also, check the bottom of your swap file for the javascript code specific to this menu bar. Spry menus come with three components, the call to the head of the document for the javascript files and css, the structure itself in the body of the document and javascript code at the bottom of the body (before the tag).

Javascript is not published (and not for the faint of heart); the css controls the menu bar similar to and can be edited with care, and this at the bottom of the page (for example), defining the new variable in the menu bar: