Why is CSS rule for NavDiv controling CSS rule for ContentDiv?

Help Please.  CSS rules are controling my layout and I cannot add a list into my content.
The CSS rule for my NavigateDiv appears to control the List in my ContentDiv and I cannot get the ContentDiv list to format.
css file: http://swilkins.free0host.com/roswell/roswell.css
html file:http://swilkins.free0host.com/roswell/attractions2.html
I want to put a list under State Parks in the ContentDiv
What is required to have the contents CSS not controlled by the navigate ul, li CSS?
Using Dreamweaver CS4, Windows Vista
I posted this yesterday and was requested to post my files.  I did so, however didn't receive a response.
Thanks in Advance

Change this:
#navigate ul, li {
     float: left;
     list-style: none;
     margin: 0px;
     padding: 0px;
     display: block;
To this:
#navigate ul, #navigate li {
     float: left;
     list-style: none;
     margin: 0px;
     padding: 0px;
     display: block;
And you have a few validation errors in your code. Use these on-line code validation tools.
HTML Validator - http://validator.w3.org
CSS Validator - http://jigsaw.w3.org/css-validator/
Nancy O.
Alt-Web Design & Publishing
Web | Graphics |  Print | Media Specialists
www.alt-web.com/
www.twitter.com/altweb

Similar Messages

  • Advanced administration for granular control in ondrive for business

    going thru the features of onedrive for business, we would like to know how the " advanced administration for granular control" works. can we able to share publicly.

    Hi,
    In KO02 open the order, and in menu options Environmnet > Change Documnets > For Status.
    Regards
    Sreekanth

  • Looking for MSI Control Center Tutorial for overclocking i7 2600K

    Please, I am looking for a Detailed TUTORIAL for overclocking With MSI Control Center an I7 2600K on P67A-GD55 motherboard.
    Thank you.

    Quote from: Bernhard on 18-October-12, 14:39:08
    Intel absolute max is 100C, but for 24/7 continuous temps 70 to 80C under full load is a sensible.
    My personal comfort zone is around 70C. I use Prime95 to see where the temps top out. As long as that is 80 or below, I am happy, as I know that no program that I use stresses the CPU 100% all the time.
    The only time I made sure that I stayed at 75 max was when I was folding. That pushes the CPU to 100%. I ran my 2600K for one year continuous and the core temps were always between 65 and 75 at 4,5GHz, my core voltage was at around 1,35V. That CPU still has no issue.
    Thank you for your feedback.
    In fact, I'm looking for how to proceed with MSI Control Center to achieve the optimal settings for overclocking.
    What are the steps to increase the multiplier and possibly increase the voltage?
    Then, indeed, I think it will be better to enter these overclocking settings in the bios.

  • WHY!?!?! Why do I have to make a CSS RULE with every Font Change

    I am no major developer, but I have been using dreamweaver to build basic HTML sites for years. Just downloaded CS5 and I am ready to put my fist through the screen.
    I am creating a NEW HTML document. I dont know much about CSS so I am avoiding it.
    So I create a few tables, put text in the table, and go to change the attibutes like size, color, etc. Now I need to define it by making a CSS rule. Ok, perhaps I am a bit behind, but I selected a new HTML document, NOT CSS. Why do I have to define anything with CSS?
    Yes, this is a basic basic thing I am trying to do. For years if I wanted to change the color, size, position, etc of some simply text in DW, it would just do it. I would never be asked to make a rule.
    What is frusterating me is that I am making a rule, adjusting text, I can partially live with that. But now it is changing the attributes of text on the other wide of the page in a different table because it had similar attributes.
    How do I go back to old school html, stright forward, no CSS.
    thanks!
    Jason

    KeyWestInc wrote:
    I am no major developer, but I have been using dreamweaver to build basic HTML sites for years. Just downloaded CS5 and I am ready to put my fist through the screen.
    I am creating a NEW HTML document. I dont know much about CSS so I am avoiding it.
    So I create a few tables, put text in the table, and go to change the attibutes like size, color, etc. Now I need to define it by making a CSS rule. Ok, perhaps I am a bit behind, but I selected a new HTML document, NOT CSS. Why do I have to define anything with CSS?
    Yes, this is a basic basic thing I am trying to do. For years if I wanted to change the color, size, position, etc of some simply text in DW, it would just do it. I would never be asked to make a rule.
    What is frusterating me is that I am making a rule, adjusting text, I can partially live with that. But now it is changing the attributes of text on the other wide of the page in a different table because it had similar attributes.
    How do I go back to old school html, stright forward, no CSS.
    thanks!
    Jason
    This question comes up a lot and it always interests me.  If you choose a profession, why would you choose something you don't want to continue learning about?  Would you be mad if your mechanic wouldn't repair your hybrid car engines because they only want to work on engines from the muscle cars of the 60s and 70s?  Or would you prefer a doctor only give you penicillin for everything because they don't want to learn about the modern advances in medicine? It just doesn't make sense.
    Best advise I can give you is that CSS is the way all web browsers and email clients are going whether through the use of attached style sheets with defined styles, or with inline styles for email security reasons.  CSS is the styling for anything web based.  Even if you are not in a CSS document, HTML pages use CSS to render styles from colors and margins to borders and backgrounds.  Then if you use a rule over and over you don't have to click through this color and that size and that underline with this font.  You just select a style where you want it and keep going.  The learning is worth the time invested.
    http://w3schools.com/css/default.asp

  • Looking for Table to CSS Converter

    I'm asking the Dreamweaver Community for HELP...
    I currently own CS3 of Dreamweaver and while there are some
    ways to convert tables to a css format manually.
    Is anyone using a software or a work-a-round to automate this
    process of converting TABLES to CSS automatically.
    For example i have DOZENS OF HTML pages that are loaded with
    Nested Tables... and all i want to do is run that HTML page through
    a TABLE to CSS converter.
    And then that’s it... you're done!... no tedious copy
    and pasting converting one table at a time.
    Does CS3 have something I’m missing that would remedy
    this or make Converting Tables to CSS more automated and not
    one-at-a-time converting?
    Thanks for any suggestions or links.

    A well built page with tables is infinitely more
    representative of your work
    than the train wreck that results when you convert tables to
    layers.
    Put a 5x5 table on the page, merge and split some of the
    cells, add some
    content to each cell, and convert to layers. Look at the
    incredible mess
    you have now in your code. Preview in a browser, and expand
    your text size
    in the browser. Look at the incredible mess you have in the
    browser.
    I think your approach is COMPLETELY wrong.
    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
    ==================
    "RegGFX" <[email protected]> wrote in
    message
    news:[email protected]...
    > Thanks for helping me find the Convert to Divs button...
    i'll test it out.
    > I
    > went on the web and googled Table2CSS and found some
    interesting tools...
    > In regards to the question about Converting Tables to
    Divs or pure css....
    > In reply too:
    >
    quote:
    Question is why do you want to do this? To say that there are
    no tables
    > in
    > the page?
    > Well that seems to be the NEW RAGE(actually its not new
    though)... create
    > websites without TABLES.... google it on the Web and
    you'll see all the
    > responses. Its almost as big a argument as MAC vs. PC
    all though we know
    > that
    > "Talent" is what drives creativity... the tool is just a
    tool to
    > accomplish
    > your job...but thats for another discussion
    > Anyway back to the CSS design vs. Table design website.
    >
    > I had 2 friends who went on job interviews where they
    showed samples of
    > their
    > websites to 3 different large corporations and all 3
    interviews said "we
    > want
    > to see websites .
    WITHOUT tables and using only CSS and or DIVs." as
    > samples for their portfolios
    > WOW... i thought so....
    > I've talked to a number of other friends in large
    companies and this is
    > the
    > going trend now... Design TABLELESS Websites (if you
    google that you'll
    > find
    > that as well) and use only pure CSS. Many company's are
    doing this I think
    > its
    > because knowone can seem to figure out Tables.
    >
    > Now i personally have been designing websites for a
    little over 10 years
    > and
    > have never had issues with Tables to design a website
    although i do
    > understand
    > the arguments behind load times... I think its because
    some out there
    > still
    > haven't got the nack of how to design a website and
    limit the load times
    > while
    > still using Tables.
    >
    > So in view of the feed back i've been getting about this
    pure CSS website
    > and
    > no tables trend, I've been converting some of my 10 page
    client websites
    > to
    > PURE CSS just because i got an inside tip that company's
    will pay big
    > bucks to
    > convert their website to PURE CSS and no tables just
    becuase another
    > I.T.executive consultant said that is the route to go.
    >
    > Again... for me... its all about knowing how to optimize
    your webpages
    > whether
    > you're doing Tables or Pure CSS.
    > Its also about if your website makes the user have to
    "THINK TO MUCH"...
    > you
    > can build a cool website design with out making the user
    "Think To Much"
    > such
    > as How long is this website going to take to load, or
    why is it so
    > complicated
    > to navigate with all these uncessary tables and
    etc...but again the "Don't
    > Make
    > Me Think" syndrome is for yet another discussion
    >
    > Anyway... thanks for the tip about Dreameweaver's
    "Convert" button....
    > i've
    > tried it and its ok... but it needs alittle refinement
    on automation. (for
    > example it would be nice if it put the CSS in a TAG up
    in the head like a
    > Table2Css conversion tool i found.)
    >
    > Best Regards,
    >

  • Documentation for FXML and CSS

    Where can I find documentation that lists all the different things you can do using FXML and CSS for JavaFX?
    For example, how am I supposed to know that I can do "-fx-font-size: 12px" for font size in CSS or "Font name='System' size='12.0' />" for FXML?

    CSS Styling
    Here is the css reference guide, which is an excellent start.
    Complement it by thoroughly studying caspian.css (the JavaFX 2.2. stylesheet) and modena.css (the JavaFX 8 stylesheet).
    There is also css styling info scattered throughout the Oracle JavaFX tutorials.
    Try using the material from the css reference guide to style some of the simple default controls, like buttons etc.
    Once you have the hang of that, move on to more complex things like graphs and tables.
    Don't forget tricks like overriding some of the default paint constants as it makes styling much easier if all you need is a color change, for example try the following stylesheet:
    .root { -fx-base: antiquewhite; }
    FXML Reference
    There is (and never will be) any such thing (as least not a complete one).
    FXML works by reflecting on classes.
    As you can add more classes to your classpath or modify existing classes, you can add more elements and attributes to fxml.
    Best current documentation of fxml is the Introduction to FXML as well as the FXML tutorials from Oracle.
    In terms of learning some of the more common elements and attributes for FXML for standard JavaFX controls, try loading up SceneBuilder and examining the FXML it generates.
    Also, as FXML is a reflection of the JavaFX Java API, you can get to know what attributes and elements it can use by looking at the standard JavaFX javadoc.
    All that said, I think the FXML documentation could be improved, so if, after you go through in detail studying the available information I provided in this post, you have concrete ideas for improvement of the documentation, feel free to file specific detailed requests in the JavaFX issue tracker, or send feedback to the JavaFX documentation team's email address: [email protected]

  • [svn] 4756: Bug fix for universal Advanced CSS selectors.

    Revision: 4756
    Author: [email protected]
    Date: 2009-01-30 07:58:55 -0800 (Fri, 30 Jan 2009)
    Log Message:
    Bug fix for universal Advanced CSS selectors.
    1. In CSS, the universal selector * matches any element. It is often implied in selectors, such as the .foo class selector would formally be written *.foo { }. So, what we were previously calling "global selectors" will now be referred to as universal selectors. Flex retains its own special top level "global" selector to function as the root of the inheriting style prototype chain, but other universal selectors will not be associated with this special subject.
    2. When looking for universal selectors, we now match against all possible selectors that have * as the subject rather than trying to pick out specific styleName (class), id or pseudo conditions. This is needed as there may arbitrary advanced conditions in the selector chain, for example, descendant selectors that have a universal subject. Note this was the actual cause of the bug - but the other fixes were needed to separate "global" from "*".
    3. In the compiler, we'll still use the generated _globalStyles.as (i.e. from the "global" StyleDef collection of style declarations) as the place holder for universal selectors (as _*Styles.as would be an invalid ActionScript class name), though these universal selectors will report their subject as "*".
    4. When representing a selector in full as a String, we'll continue to omit "*" as the subject and substitute the empty string, so "*.foo" will be printed as ".foo".
    QA: Yes
    Doc: No
    Checkintests: Pass
    Reviewer: Paul
    Bugs:
    SDK-18196 - [Advanced CSS] Descendant selectors with class selectors like VBox .greenBox are not working correctly.
    Ticket Links:
    http://bugs.adobe.com/jira/browse/SDK-18196
    Modified Paths:
    flex/sdk/trunk/frameworks/projects/framework/src/mx/styles/CSSSelector.as
    flex/sdk/trunk/frameworks/projects/framework/src/mx/styles/StyleProtoChain.as
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/css/StyleDef.java
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/css/StyleDef.vm
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/css/StyleModule.java
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/css/StyleModule.vm
    flex/sdk/trunk/modules/compiler/src/java/flex2/compiler/css/StylesContainer.java

    Change this:
    <div class="mainnav">
    <li id="width-HealthWellness"><a href="#">Health/Wellness</a></li>
    <ul>
    <li>Flu Section</li>
    <li> Infection Control</li>
    <li> Nutrition</li>
    <li> Physical Fitness</li>
    <li>NIH Newsletters</li>
    </ul>
    to this:
    <div class="mainnav">
    <li id="width-HealthWellness"><a href="#">Health/Wellness</a>
         <ul>
         <li>Flu Section</li>
         <li> Infection Control</li>
         <li> Nutrition</li>
         <li> Physical Fitness</li>
         <li>NIH Newsletters</li>
         </ul>
    </li>
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb
    http://alt-web.blogspot.com/

  • Why do we require Wildcard control flow rule?

    Hi,
    Why do we require wildcard control flow rule?
    Can anyone please explain me with a scenario?
    Thank you,
    Srinivas

    Wildcard rule means the rule is valid on all the taskflow's pages, so you don't have to wire the case separately from each page. Handy if you have for instance a button with a common action on many pages.
    See this example: http://blogs.oracle.com/jdev11g/2009/10/wildcard_control_flows_for_page_navigation.html

  • Accordion control CSS styles only support Websafe colours?

    I'm experimenting with styling controls using CSS by messing about with the style for my Accordion control. Here's my current CSS
    Accordion 
    themeColor: #0066ff;
    textRollOverColor: #0066ff;
    dropShadowEnabled: true;
    dropShadowColor: #888888;
    openDuration: 800;
    headerStyleName: "myaccordionHeader";
     .myaccordionHeader 
    fontFamily: Arial;
    fontSize: 12;
    fontWeight: bold;
    fillColors: #ffffff, #cccccc, #ffffff, #ff55ff;
    /* fillAlphas: 0.69, 0.4, 0.75, 0.65; */
    selectedFillColors: #99cc33, #99cc33;
    If I change the selectedFillColors to #f5f5f5, #f5f5f5 or some other non-web-safe colour, the Accordion selected fill colours revert to the Flex default. Same seems to apply to other colours too.
    I have a project coming up that has specific colours; is there a way for me to use 'any' colour in the CSS style? Am I just going crazy? :-)
    Steve

    I have read the white paper that you have referred to in your response and have included the following in the Header section of my Reports Region -- I am using a custom CSS to format the Table Headers <th> and the table data <td>:
    <head>
    <title>Air Road Dispatch Board</title>
    #HEAD#
    <link rel="stylesheet"
    href="#WORKSPACE_IMAGES#test.css"
    type="text/css" />
    </head>
    The table data is working based on the CSS but the table headings are still not working correctly and the substitution string #HEAD# is sending the #HEAD# as output on my report at the top. I understood that by placing the reference to the .CSS after the #HEAD# that it would bypass the classes from the core.css file. But obviously this is not working. I also tried the same code above in the page html header to see if it worked but received the same results.
    Any ideas?
    Regards,
    Jeffrey

  • Why does iphone has common volume control for ringer as well as Alarm?

    Why does iphone has common volume control for ringer as well as Alarm? which is quite unusual. For Exp, In case i lower down my ringer for some reason instead of silent and forget to increase before i sleep, my morning alarm also remains at the same ringer level volume at which i can miss the alarm. Is it due to some specific reason or i have missed something to change in settings. Other phone like Samsung etc, they have separate volume control for ringer and to an extent, Nokia rings for Alarm even if the battery is completely discharged.

    I have booked an appointment at my nearest Genius Bar which is 40 minutes away next week, so do I need a reciept or is the warranty checked from the serial number?
    No receipt needed.
    and is it covered under Apple's 12 month warranty?
    It very well may be covered, depending on what Apple finds.

  • Spry menu for my phone.css and tablet.css?

    I finished learning how to set up my media queries and during the process I changed the properties of my spry menu for my phone.css. I now realize that all my menu bars are the size that I did for my phone.css.
    How can I get my phone.css and tablet.css to recognize different spry menu bars? I was thinking to place certain spry menu css information inside of the appropriate phone.css or tablet.css (in my case) then within my #navigation ID.
    Does anyone see what trap I have set for myself?
    This has come about when I started to make a current site viewable in a tablet and phone device. As I change the spry menu bar it changes all of my navigation.
    Thanks in advance for the help.

    So in other words are you saying to paste in my spry menu bar css code into let's say my phone.css?
    current phone.css code:
    <><>
    @charset "utf-8";
    @import url("SpryAssets/SpryMenuBarHorizontal.css");
    body {
        text-align: center;
        background-color: #be7042;
    #wrapper {
        height: 750px;
        width: 320px;
        margin-right: auto;
        margin-left: auto;
        background-color: #006400;
        position: static;
    #bottombanner {
        text-align: center;
        height: 192px;
        width: 320px;
        margin-right: auto;
        margin-left: auto;
        margin-top: 25px;
        font-family: Verdana, Geneva, sans-serif;
        font-size: 8px;
        line-height: 2px;
        color: #FFF;
        position: static;
    #ckimage {
        text-align: center;
        height: 145px;
        width: 75px;
        margin-top: 50px;
        margin-left: 20px;
        font-family: Verdana, Geneva, sans-serif;
        font-size: 6px;
        color: #FFF;
        position: static;
    #estriolimage {
        text-align: center;
        height: 75px;
        width: 56px;
        margin-top: 45px;
        margin-left: 26px;
        font-family: Verdana, Geneva, sans-serif;
        font-size: 6px;
        color: #FFF;
        position: static;
    #maincopy {
        font-family: Verdana, Geneva, sans-serif;
        text-align: left;
        height: 350px;
        width: 200px;
        margin-top: -265px;
        margin-left: 115px;
        color: #FFF;
        font-size: 8px;
        position: static;
    #navigation {
        text-align: center;
        height: 49px;
        width: 320px;
        margin-top: 1px;
        position: static;
    #topbanner {
        text-align: center;
        height: 48px;
        width: 320px;
        margin-right: auto;
        margin-left: auto;
        position: static;
    ><><
    Would I paste my spry menu bar css code into my #navigation portion of my phone.css (I bolded the part where I think I would paste in my spry menu css.)

  • Support for Bootstrap 3 CSS?

    Hi,
    A UI designer at my company is using Bootstrap 3 to create the look and feel (CSS and skin) to be used by new SW products. Does RoboHelp 10 allow me to import or link to a CSS created with Bootstrap 3? Or can I copy and paste portions of the Bootstrap CSS into the RoboHelp project CSS?
    Thanks!
    Gabe

    Bootstrap is a template language that relies on JS, itsn’t it? If so, you can use it, but the RH interface won’t support it. Also, you will need to make the JS file available for all topics as well.
    One possible issue you may encounter: If RH doesn’t understand the CSS you provide, it may rewrite portions of the CSS to make it understandable for RoboHelp. So you may need to replace the CSS after generation with the correct CSS.
    Greet,
    Willam

  • Why is DW too dumb to leave css files callapsed.

    Why is DW too dumb to leave css files callapsed in panel when we leave them so. [Deleted] DW always expands all files so we can close them all every darn time we open the file. [Personal abuse deleted by moderator]

    Okay, I see what you're saying. In the CSS Styles panel, if you collapse the top node of any of the style sheets and then close the file, they are all expanded the next time you open the file. I agree with you - I'd expect Dreamweaver to remember the state of the panel, however it is left when the file is closed. It does this with collapsed code (which is what I thought you were referring to), so it would make sense to do the same with the CSS Styles panel.
    You can report this bug / feature request here.
    Best - Joe
    Joseph Lowery
    Author, Dreamweaver CS4 Bible

  • Dreamweaver CC - Rollover image to text transition for Fluid page css/html5

    Hi All,
    I am using Dreamweaver CC, Windows 7, PC.
    Goal: To create a selectable text and colour overlay (not a second image with text in the image) that appears over the top of an image on rollover of the container that the image is located in, all inside a fluid page.  Also I would like to avoid jquery and javascript if it's possible.
    Please see the attached HTML5, CSS and 300x300jpg example of this page which should show what i'm trying to do, as you can see currently the text sits below the image on mouse hover and should be fitting nicely inside the image box.  I will replicate this through all the images once I have it working correctly also.  Please note the page fluid scaling at different sizes as I need the rollover to work at whatever size the window or device is.
    Thank you in advance for any answers, ideas, work arounds etc you may have or if i've missed this specific scenario covered elsewhere?
    Here is the HTML (apologies for my messy code):
    <!doctype html>
    <!--[if lt IE 7]> <html class="ie6 oldie"> <![endif]-->
    <!--[if IE 7]>    <html class="ie7 oldie"> <![endif]-->
    <!--[if IE 8]>    <html class="ie8 oldie"> <![endif]-->
    <!--[if gt IE 8]><!-->
    <html class="">
    <!--<![endif]-->
    <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Untitled Document</title>
    <link href="../boilerplate.css" rel="stylesheet" type="text/css">
    <link href="../Website_Testing/style.css" rel="stylesheet" type="text/css">
    <!--[if lt IE 9]>
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <script src="../respond.min.js"></script>
    </head>
    <body>
    <div class="gridContainer clearfix">
      <article id="article" class="fluid">
        <div id="Examples" class="fluid">
          <div id="example1" class="fluid">
              <img src="images/300x300.jpg" alt=""/>
              <span class="text">TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT </span>
          </div>   
          <div id="example2" class="fluid"><img src="images/300x300.jpg" alt=""/></div>
          <div id="example3" class="fluid"><img src="images/300x300.jpg" alt=""/></div>
          <div id="example4" class="fluid"><img src="images/300x300.jpg" alt=""/></div>
        </div>
      </article>
    </div>
    </body>
    </html>
    Here is the CSS (apologies for my messy code):
    @charset "utf-8";
    img, object, embed, video {
        max-width: 100%;
    /* IE 6 does not support max-width so default to width 100% */
    .ie6 img {
        width:100%;
    .fluid {
        display: block;
        text-align: center;
        clear: none;
        float: none;
    .fluidList {
        list-style:none;
        list-style-image:none;
        margin:0;
        padding:0;       
    /* Mobile Layout: 480px and below. */
    .gridContainer {
        margin-left: auto;
        margin-right: auto;
        width: 100%;
        clear: none;
        float: none;
    #article {
        min-height: 160px;
        margin-left: 0;
        padding-left: 5%;
        padding-top: 16px;
        padding-bottom: 16px;
        padding-right: 5%;
        background-color: rgba(255,254,191,1.00);
    #Examples {
        text-align: center;
        padding-top: 16px;
        padding-bottom: 16px;
        margin-left: auto;
        margin-right: auto;
    .zeroMargin_mobile {
    margin-left: 0;
    .hide_mobile {
    display: none;
    #Examples #example1 {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    #Examples #example2    {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    #Examples #example3 {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    #Examples #example4 {
        padding-top: 5%;
        padding-bottom: 5%;
        display: block;
        width: auto;
    .text {
        position: relative;
        display: none;
        background: #999;
        background: rgba(0,0,0,0.3);
        text-align: center;
        top: 0px;
    #example1:hover .text {
        display: block;
        background-color: rgba(12,109,242,1);
    #example1 {
        -webkit-transition: all 0.35s ease-in-out 0s;
        -o-transition: all 0.35s ease-in-out 0s;
        transition: all 0.35s ease-in-out 0s;
    #example1:hover {
        background-color: rgba(12,242,109,1.00);
    #example2 {
        -webkit-transition: all .35s ease-in-out;
        -o-transition: all .35s ease-in-out;
        transition: all .35s ease-in-out;
    #example2:hover {
        background-color: rgba(12,242,109,1.00);
    #example3 {
        -webkit-transition: all .35s ease-in-out;
        -o-transition: all .35s ease-in-out;
        transition: all .35s ease-in-out;
    #example3:hover {
        background-color: rgba(12,242,109,1.00);
    #example4 {
        -webkit-transition: all .35s ease-in-out;
        -o-transition: all .35s ease-in-out;
        transition: all .35s ease-in-out;
    #example4:hover {
        background-color: rgba(12,242,109,1.00);
    /* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */
    @media only screen and (min-width: 481px) {
    .gridContainer {
        width: 100%;
        margin-left: auto;
        min-height: 100%;
    #Examples {
        text-align: center;
        min-height: 640px;
    .hide_tablet {
    display: none;
    .zeroMargin_tablet {
    margin-left: 0;
    #Examples #example1 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    #Examples #example2 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    #Examples #example3 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    #Examples #example4 {
        float: left;
        padding-left: 2%;
        padding-right: 2%;
        padding-top: 2%;
        padding-bottom: 2%;
        width: 46%;
    /* Desktop Layout: 769px to a max of 1232px.  Inherits styles from: Mobile Layout and Tablet Layout. */
    @media only screen and (min-width: 769px) {
    .gridContainer {
    #article {
        margin-left: 0;
    #Examples {
        text-align: center;
    .zeroMargin_desktop {
    margin-left: 0;
    .hide_desktop {
    display: none;
    @media only screen and (min-width:1024px){
    #article #Examples #example1 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #article #Examples #example2 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #article #Examples #example3 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #article #Examples #example4 {
        width: 23%;
        padding-left: 1%;
        padding-right: 1%;
        padding-top: 16px;
        padding-bottom: 16px;
    #Examples {
        min-height: 340px;
    And here is a 300x300 grey image i'm using as an example holder:
    Thanks for taking the time all,
    Jeff

    Try this in a new, blank document:
    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>HTML5 with Pure CSS Rollovers</title>
    <style>
    -moz-box-sizing: border-box;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    body {
    font-family:Segoe, "Segoe UI", "DejaVu Sans", "Trebuchet MS", Verdana, sans-serif;
    font-size:100%;
    #rollover a {
    display: inline-block;
    position: relative;
    margin-right: 2%;
    text-decoration: none;
    color: #FFF;
    #rollover a span {
    display: block;
    visibility: hidden;
    background-color: #3CC;
    position: absolute;
    z-index: 100;
    left: 0;
    top: 0;
    font-size: 13px;
    font-weight:bold;
    line-height: 1.2;
    color: #FFF;
    text-align: center;
    border: 5px solid orange;
    padding: 5px;
    width: 200px;
    min-height: 125px;
    #rollover a:hover span,
    #rollover a:active span,
    #rollover a:focus span { visibility: visible; }
    #rollover a:hover,
    #rollover a:focus { visibility: visible; }
    </style>
    </head>
    <body>
    <div id="rollover">
    <p>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    <a href="#"><img alt="description" src="http://placehold.it/200x125">
    <span> Lorem ipsum dolor sit amet, consectetur adipiscing elit.
    Mauris vitae libero lacus, vel hendrerit nisi!
    Maecenas quis velit nisl, volutpat viverra felis. </span></a>
    </p>
    <!--end rollover--></div>
    </body>
    </html>
    Nancy O.

  • No control data maintained for checking group ZI and checking rule A

    Dear all,
                   When i do the availability check in the sales order i got the message as  No control data maintained for checking group ZI and checking rule A and finally availability check was not carried out, I check all the configuration under the sd-availabilitycheck and i maintained in material master also..........
    Please give me the solution
    Best Regards ,
    Kumar

    Hi,
    Did u maintain the scope of availability check like incluke reqts,planned reqts, purchase requisitions, production order, sales reqts,delivery reqts etc.
    apart from that you have to put check(Tick) mark in Requirment class and scheduleline categorie
    Then u have to maintain in material master individual requirmentss or daily requirments
    checking rule like A,B or if its consignment AW if it is returnable packaging AV etc(ImgS&D-Basicfunctions-Availabiltycheck&Tor---availability check aginst ATP)
    Then Total summarized daily reqts or summarized individual requts
    Plz check above all setting then u will get clear idea.
    Regards,
    Murthy

Maybe you are looking for

  • Error while creating Purchase order

    Hi Experts, No posting rules exist for account key Message no. FF714 Diagnosis No posting rules have been defined for the account key in the tax table in table T007B. Procedure Change the tax table, enter an account key already defined for the transa

  • Customising for create purchase order

    Hello, i have an error message when i save my purchase order without a tax code. I would like to set the tax code field to not-obligatory based on my purchase order type.Does anyone know the customising path? e.g if purchase order type = 'ZPCG' tax-c

  • IOS cannot be updated.

    When I upgraded iOS from 7.1 to 7.1.1, an error orrured. And I used the cable to connect to computer. Also cannot update. Now my iPad cannot be turned on. How to fix this problem?

  • Final cut wont render

    I've just come across a strange problem. Final Cut will no longer render out. When I click on render all, render video, etc, the task window bar pops up for a split second as it would when rendering, and then closes. I've tried rebooting, trashing pr

  • Installation Problem - Supposed Invalid Serial Number

    Two months ago I bought Creative Suite 4 Student Edition online and still have yet to get it working. I must say it has been a painfully frustrating experience and I desperately need it for school. I have logged onto my Adobe online account and gone