CSS styling issue

I added a new style called 14 changed the text and spacing of the rest of the site (it's 16 and other parameters)

He works in dreamweaver, but when I see it on the web, it's always the old size of a table - < td >

When I surligner highlight the text, then select 'class' it will add a "span" sometimes

Other times, when between < td > he will add it to the < td > and it won't work.

It does not work

< height td = "100" align = "center" valign = "top" class = "14" >

It does not work

< span class = "14" >

CSS is simple:

.14 {}

do-family: ' open without ", without serif.

do-size: 14px;

line-height: normal;

color: #666;

line-height: 20px;

}

What Miss me?

example:

digitaldealershipsystem.com/Gallery.html

The text in the gray area is marked with < height td = "100" align = "center" valign = "top" class = "14" >

I hope that I can add a TD or similar, but I don't want that it applied to all tables

PS > there is obviously some HTML and other issues, but I'm afraid that with that right now.

Thank you.

CSS selector names must be from Aa to Zz.  They may not begin with numeric values.

.14 is invalid code.

.style14 is the valid code.

Instead of using the selector names that carry no deliberate meaning, try using the selector names that tell you what the style is used for.  It makes your code easier to handle.

Read the article:

http://phrogz.NET/CSS/HowToDevelopWithCSS.html

Nancy O.

Tags: Dreamweaver

Similar Questions

  • Format text with css styling

    I need to assign a css style to some paragraphs of the text. Please how me how to do this using DreamWeaver in Live view mode.

    #1 in Code view:

    class = "myStyle"> YOUR TEXT HERE

    In the design or Live View, highlight text and select class you want in the properties panel.  See screenshot.

    #2 correct.  Styles can be applied to an entire table, selected lines or individual cells.

    class = "myStyle">

    a text

    a text

    Nancy O.

  • CSS styling to set the background color of replacement

    I would like to have something that looks like the table of this line replacing using CSS background. The following code does not work for me.

    Part of VBox = new VBox();
    for (int i = 0; i < 5; i ++)
    {
    Button HBox = new HBox();
    button.setAlignment (Pos.CENTER);
    final lblName Label = new Label ("Label" + i);
    lblName.setStyle ("police - fx -:" BOLD "arial 14");
    button.getChildren () .add (lblName);
    button.setMinSize (300, 46);
    button.setMaxSize (300, 46);
    button.setPrefSize (300, 46);

    button.getStyleClass (.add("search-item"));
    If (i % 2 == 0) {}
    button.getStyleClass () .add ("even");
    }
    pane.getChildren () .add (button);
    }

    . Search-item {}
    -fx-background-color: white;
    -fx-border-color: lightgray;
    -fx-border-width: 1px 0 0 0;
    }

    . Search-point: even {}
    -fx-background-color: lightgray;
    }

    You use "yet" as a style class in the code and 'yet' as a CSS pseudo-class. The difficulty here is simple. Just replace: even with even and close the space.

    .search-item.even{
        -fx-background-color: lightgray;
    } 
    
  • tag and css div issue

    I am slowly converting my site to use the div and css tables tags and have just a few simple questions. Please be patient with my stupidity.

    on my site www.tankinz.com to the right of the page, there is a quick order guide, it consists of boxes offers different packages that can be purchased, it is easy to create tables, but with the div and css tags it makes sense, but executing what I want it to do is another story.

    as far as I understand, that each of these boxes would be a tag div and css I can style each box, or the div tag, including its size, color etc. when I create the div tags all stacked on each other, how to align the so that they are side by side, I suppose it has to do with 'the box settings' section of css can anyone help?

    Yes. Put what you like in the floating #boxes.

    Forget everything you learned in FrontPage.  Deprecated invoked FP code owner of MS that do not meet the standards of the web so much less today. The align attribute is invalid and has been since HTML4 came out.

    DW forces you to use CSS and web standards.  It is also easier to work if you have a good knowledge of modern (semantic markup) HTML & CSS.   Practice makes perfect.

    Some links below to help you.

    HTML & CSS Tutorials-

    http://www.html.NET/

    http://w3schools.com/

    How to develop with CSS? (a must read)

    http://phrogz.NET/CSS/HowToDevelopWithCSS.html

    Centering of Pages, Images and other elements with CSS

    http://cookbooks.Adobe.com/post_Centering_web_pages_and_other_elements_with_CSS-16640.html

    Nancy O.

  • CSS layout issues

    IM probably missing something stupid and obvious, but im trying to add previous buttons and next to my layout and its does not work

    I want that:

    http://toddheymandirector.com/Archive/2/

    to look like this:

    http://toddheymandirector.com/images/archive.jpg

    My stylesheet:

    http://toddheymandirector.com/CSS/style_heyman_1.CSS

    ideas?

    Instead of floating the previous buttons and following, do the main-content class relatively placed.

    Then make the class of fadehover positioned in absolute terms.

    #next {top: 170px; right - 30px ;}}

    #prev {top: 170px; left: 30px}

    Very rough calculations, but it should give you the idea.

  • Help with CSS styling

    Hallo,

    I'm looking CSS style help on how to position a feedback link on the right side of my screen and let unscrollable even when the user scrolls the borwser. I'd like something that will stay on the right side of the browser, like the adobe in top-right search engine, but for my case, I would like to stress that in the middle.

    Thanks in advance,

    R.

    Hello

    Use a css position: fixed; rule, see - http://www.w3schools.com/css/css_positioning.asp.

    PZ

  • CSS layout issue

    Hi there and that if a long time for your help. I'm sure the answers are easy.

    My questions are all on this page:

    http://www.energywa.co.za/CSS-layout.php

    I am busy redesigning our web site and have forgotten a lot of CSS stuff, I used ± 3 years.

    1. so that this provision to work, I had first put in the column on the right handed and after the main content. It shows why not in order?

    2. How can I make sure that the columns on the right do not spread in my footer if the text is longer than the main content?

    Any suggestions in a different way is welcome, please.

    Kind regards

    Deon

    (1) you can have it left then right, what you just float to the left to the left and the right to the right.

    / * copied from firefox firebug * /.

    {.oneColFixCtrHdr #mainContent
    -moz-background-clip: border;
    -moz-background-inline-policy: continuous;
    -moz-background-origin: padding;
    background: #FFFFFF no-repeat scroll 0 0;
    float: left;
    padding: 0 20px;
    Width: 780px;
    }
    then you can have the content in the correct order.

    -After you do this, you will get the footer color behind your right sidebar that brings us to question 2

    (2) add clear: both for footer styles

    .oneColFixCtrHdr #footer {}
    background-color: #FF0000;
    Clear: both;
    padding: 0 10px;
    }
  • Another CSS layout issue

    Hello!

    I finally left drop tables and I now have my first focused on the div css layout. Sometimes I feel totally lost as in this example. I can not get the subtitle of the page ("Etusivu") down from the top of the div that is. I tried different types of fillings and margins, but Firefox or IE always live it to the top, even though I operate in the other browser. If anyone can take a look, I appreciate it a lot!

    Here's my markup:

    < ! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional / / IN" "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 > Untitled Document < /title >
    < link href = "styles.css" rel = "stylesheet" type = "text/css" / > "
    < script type = "text/javascript" >
    <!--
    function MM_swapImgRestore() //v3.0 {}
    var i, x = offline. MM_sr; for (i = 0; a & & I <.) Length & & (x = a [i]) & & x.oSrc; i ++) x.src = x.oSrc;
    }
    function MM_preloadImages() {//v3.0
    var d = document; If (d.images) {if(!d.MM_p) d.MM_p = new Array();
    var i, j is d.MM_p.length, a = MM_preloadImages.arguments; for (i = 0; i <.) Length; i ++)
    If (a [i].indexOf("#")! = 0) {d.MM_p [j] = new Image; d.MM_p [j ++] .src = a [i] ;}}
    }

    function MM_findObj (n, d) {//v4.01
    var p, i, x;  if(!d) d = document; If ((p = n.IndexOf ("?")) > 0 & & parent.frames.length) {}
    d = parent.frames [n.Substring(p+1)] .document; n = n.Substring (0, p) ;}
    If (!) () x = d [n]) & & copyrights) x = d.all [n]; for (i = 0;! x & & i < d.forms.length; i ++) x = d.forms [i] [n];
    for (i = 0;! x & & d.layers & & I < d.layers.length; i ++) x = MM_findObj (n, d.layers [i] .document);
    If (! x & & d.getElementById) x = d.getElementById (n); Return x;
    }

    function MM_swapImage() {//v3.0
    var i, j = 0, x, a = MM_swapImage.arguments; document. MM_sr = new Array; for (i = 0; i <(a.length-2); I += 3).
    If ((x = MM_findObj (a [i]))! = null) {document. MM_sr [j ++] = x; if(!x.oSrc) x.oSrc = x.src; x.SRC = a [i + 2] ;}
    }
    ->
    < /script >
    < style type = "text/css" >
    <!--
    {.otsikko}
    do-family: 'Courier New', Courier, monospace;
    do-size: 18px;
    color: #FFFFFF;
    make-weight: bold;
    text-align: center;
    }
    .leipateksti {do-family: 'Courier New', Courier, monospace}
    . Style1 {do-family: 'Courier New', Courier, monospace; color: #FFFFFF ;}}
    ->
    < / style >
    < / head >

    < body = onload "MM_preloadImages (" images/doktor_streetwear_otsikko_ro.gif','images/etusivu_ro.gif ',' images/tuotteet_ro.gif','images/tietoa_ro.gif','images/ehdot_ro.gif','images/palaute_ro.gif','images/linkit_ro.gif'")" >
    < div id = "wrapperi" >

    < div id = "logo" > < img src = "images/kannulogo.jpg" alt = "logo" / > < / div > "

    < div id = "otsikko" > < a href = "index.htm" MM_swapImgRestore"onmouseover =" MM_swapImage ('otsikko', ", ' images/doktor_streetwear_otsikko_ro.gif', 1)" > < img src = images/doktorwear_otsikko.jpg"" alt = "otsikko" name = "otsikko' width = '487' height ="87"border ="0"id ="otsikko2"/ > < /a > < / div >


    < div id = "kielet" >
    < div id = "kielet_pusher" > < / div >
    < div class = "kieli" > SUOMEKSI < / div >

    < div class = "kieli" > English < / div >
    < / div >

    "" < div id = 'navi' > < a href = "index.htm" MM_swapImgRestore"onmouseover =" MM_swapImage ('etusivu', ", ' images/etusivu_ro.gif', 1)" > < img src = "images/etusivu.jpg" alt = "etusivu" name = "etusivu" width = "130" height = "56" border = "0" id = "etusivu" / > < /a > < a href = "tuotteet.htm" MM_swapImgRestore"onmouseover =" MM_swapImage ('tuotteet', ", ' images/tuotteet_ro.gif', 1)" > < img src = "images/tuotteet.jpg" alt = "tuotteet" name = "tuotteet" width = "130" height = "55" border = "0" id = "tuotteet" / > < /a >
    "< a href ="tietoa.htm"MM_swapImgRestore" onmouseover ="MM_swapImage ('tietoa'", ' images/tietoa_ro.gif', 1) "> < img src =" images/tietoa.jpg "alt ="tietoa"name ="tietoa"width ="130"height ="55"border ="0"id ="tietoa"/ > < /a >
    "< a href ="ehdot.htm"MM_swapImgRestore" onmouseover ="MM_swapImage ('ehdot'", ' images/ehdot_ro.gif', 1) "> < img src =" images/ehdot.jpg "alt ="ehdot"name ="ehdot"width ="130"height ="55"border ="0"id ="the ehdot"/ > < /a >
    "< a href ="palaute.htm"MM_swapImgRestore" onmouseover ="MM_swapImage ('palaute'", ' images/palaute_ro.gif', 1) "> < img src =" images/palaute.jpg "alt ="palaute"name ="palaute"width ="130"height ="55"border ="0"id ="palaute"/ > < /a >
    "< a href ="linkit.htm"MM_swapImgRestore" onmouseover ="MM_swapImage (" linkit "," ' images/linkit_ro.gif', 1) "> < img src =" images/linkit.jpg "alt ="linkit"name = 'linkit" width = "130" height = "55" border = "0" id = "linkit" / > < /a > < / div >

    < div id = "vasen_palkki" > content ID "vasen_palkki" goes here < / div >

    < div id = "main_content" >


    < div class = "otsikko" id = "tekstiotsikko" > ETUSIVU < / div >

    < div class = "style1" id = "iso_alue" > Lorem ipsum dolor sit amet, adipiscing elit computer. Vivamus nec risus at posuere lorem pellentesque. Sed a lorem tellus. Nullam justo mauris, sed ultrices interdum in, EU egestas leo. DUIs, elementum interdum gravida. Curabitur had rutrum nibh. Maecenas turpis ac leo molestie nec tristique pellentesque felis mattis. Etiam placerat tortor, dignissim ac laoreet magna AC Mauris sold vestibule pellentesque tempor. Proin had city ipsum. SED tincidunt nibh sed ipsum pulvinar sold. CRAs egestas mi imperdiet Suspendisse tempus tortor eget vehicula restore, diam massa odio, vel risus nulla vitae mauris dictum lobortis. Praesent pharetra, erat tellus had fermentum vitae, sodales EU sapien. Aenean odio lectus, egestas ID, auctor nisl at mattis. Donec viverra pharetra auctor. Surpassing lectus ullamcorper, neque a ultricies a, auctor at mauris. Proin orci risus cursus non tellus lobortis dignissim quis semper. In hac habitasse platea hac. < / div >


    < / div >


    < / div >

    < / body >
    < / html >

    And here is the style sheet:

    @charset "utf-8";
    {body
    background-color: #330000;
    }
    {#wrapperi}
    margin: auto;
    padding: 0px;
    Width: 800px;
    }
    #logo {}
    float: left;
    border: 1px solid #800000;
    }
    {#otsikko}
    float: left;
    border: 1px solid #800000;
    }
    {#kielet}
    float: right;
    border: 1px solid #800000;
    height: 87px;
    Width: 130px;
    }

    {.kieli}
    do-family: 'Courier New', Courier, monospace;
    do-size: 18px;
    color: #FFFFFF;
    make-weight: bold;

    border-top-width: 1px;
    border-right-width: 0px;
    border-bottom-width: 0px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-bottom-color: #800000;
    border-right-color: #800000;
    border-bottom-color: #800000;
    border-left-color: #800000;
    padding: 5px;
    }
    {#kielet_pusher}
    height: 25px;
    }
    {#navi}
    border: 0px none #800000;
    float: left;
    Width: 130px;
    }

    #navi img {}
    padding-top: 4px;
    border-top-width: 0px;
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-top-style: solid;
    border-right-style: solid;
    border-bottom-style: solid;
    border-left-style: solid;
    border-bottom-color: #800000;
    border-right-color: #800000;
    border-bottom-color: #800000;
    border-left-color: #800000;
    padding-bottom: 4px;
    }
    {#main_content}
    }
    {#otsikko}
    }
    {#tekstiotsikko}
    top of the margin: 30px;
    margin-bottom: 30px;
    }
    {#iso_alue}
    do-size: 14px;
    text-align: left;
    margin left: 160px;
    right margin: 200px;
    }
    {#vasen_palkki}
    float: right;
    height: 400px;
    Width: 130px;
    border: 1px solid #800000;
    }
    {#main_content}
    }

    Hello

    First change this line-

    ETUSIVU
    TO

    ETUSIVU

    Then add this rule - css

    #tekstiotsikko h2 {}

    padding-top: 2em;

    }

    Replace the 2em everything you need.

    PZ

  • CSS formatting issues

    I should start this by saying: I am very new to CSS layouts and am self-taught, so I'm probably doing something very wrong. So far I have stuck to layouts very simple and had no problems... but they have been implemented with very simple page.

    With the site, I'm doing this now that I placed another div inside a content div, so that I can have left and the content of the right hand in the div content. But the left and right div isn't pushing the div contained down with their content, and I don't know what else to try to make it work.

    I tried setting the height of the div contained for auto or inherit, but who doesn't.

    As you can see on the home page of the site, I use a background image in the cell content.

    http://members.WestNet.com.au/zelky/surfschoolnew/index.html

    And if you look at the details page you can see what I'm trying to describe. The contained not div pushing down with the left and right content div content means that the background image is a few pixels deep under the nav DIV.

    http://members.WestNet.com.au/zelky/surfschoolnew/details.html

    And my pathetic/stylesheet CSS is here:

    http://members.WestNet.com.au/zelky/surfschoolnew/mainStyle.CSS

    Thanks in advance and I hope that my mess isn't ' hard to watch. As I said I'm a little lost so I hope I won't confuse anyone with my skills "home made".

    When you "float" elements on your page you remove effectively
    the normal flow of the document, the 'content '.

    think
    nothing is inside. You need to help him "compensation" by the floats.
    There are various methods of clearing of floats.

    Insert a "clearing".
    (see below) in the code of your pages directly
    AFTER the closing tag container 'just' and BEFORE the closing 'content '.
    tag Container.




    zelky wrote:
    > I should start this by saying: I am very new to CSS layouts and I am self-taught.
    > so I'm probably doing something very wrong. So far I've stuck to very simple
    > layouts and had no problems... but they have been implemented with very simple page.
    >
    > With the site I'm doing at the moment I put it inside other div has
    > content div, so that I can have content left and right in the content
    > div. But the left and right div isn't pushing the div contained down with
    > their content and I don't know what else to try to make it work.
    >
    > I have tried to adjust the height of the div contained for auto or inherit, but who
    > does not work.
    >
    > As you can see on the home page of the site, I use a background picture
    > the cell content.
    >
    > http://members.westnet.com.au/zelky/surfschoolnew/index.html
    >
    > And if you look at the details page you can see what I'm trying to describe.
    > The content div is not pushing down with the left and right content div? s content
    > means that the background image is just a few pixels deep under the nav DIV.
    >
    > http://members.westnet.com.au/zelky/surfschoolnew/details.html
    >
    > And my pathetic/stylesheet CSS is here:
    >
    > http://members.westnet.com.au/zelky/surfschoolnew/mainstyle.css
    >
    > Thanks in advance and I hope that my mess isn't? t? hard to watch. As I said
    > I'm a little lost so I hope that I won't confuse anyone with my "home-made".
    > skills.
    >
    >

  • CSS / DIV Issue

    Hi all

    I'm not necessarily new Div/CSS layouts, but I'm having a problem at the moment that makes me batty!

    Here is the page:
    http://www.assumption.edu/programs2006/master/default.html

    Here's the CSS:
    http://www.assumption.edu/programs2006/master/CSS/layout.CSS

    If you try to watch it in the browsers of Gekko, it works fine... but if you try to watch using MS IE or Safari for Mac, the page is completely white... completely empty.

    I'm sure it's a simple little something, but I can't seem to find that needle in a haystack.

    Thanks for any idea!
    Ron

    Thierry,

    I can't believe I did such a rookie mistake! But after further investigation, I had 2 sets ofTags... Oh! (best impression of Homer Simpson)<p class="reply"> <p class="reply">Thanks for catching it!</p> <p class="reply">Ron</p>

  • Tag DIV, positioning CSS H1and issue

    Hi all
    I have a basic question concerning the placement of a text inside a < div > tag. Essentially, I am creating a small topic block (the < div > tag) 750px wide by high 25px, with a left-aligned title text and a prize titled text aligned to the right and 5px of padding around the text on all sides.

    The problem I have is just to get the right text aligned to move far enough to the right of the block 750px topic using CSS. I want to create more space between the end of the title text and the beginning of the price text, but because the length of the title text will vary from point to point, I can't use a compensation of the left margin of the title text. Basically I want to compensate the right text to the far right of the header itself block edge without the use of tables. I hope this makes sense.

    What would be a good approach to take to do something as simple as this, not to mention that I am trying to create something that "looks like" a table without using tables?

    Thank you
    ~ Greg

    We will see the page, please.

    A float located on contano of text with a right margin may be whatever you
    need.

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

    "Myrrhlin225" wrote in message
    News:f58vph$1u6$1@forums. Macromedia.com...
    > Hi all,
    > I have a fundamental question regarding the placement of a text inside a
    >


    > tag. I'm basically trying to create a small topic block (the
    )
    > 750px
    > integer by 25px high, with a left-aligned title text and a price
    > topic text aligned to the right and 5px of padding around the text on all
    > side.
    >
    > The problem I just becomes right-aligned text move away
    > no longer enough on the right block 750px topic using CSS. I want to
    > create
    > more space between the end of the title text and the beginning of the
    > price
    > text, but because the length of the title text will vary from point to point, I
    > can not
    > use a shift to the left margin of the title text. Basically I want to compensate for
    > the
    > good text from the edge to the right of the header block itself without
    > help
    > tables. I hope this makes sense.
    >
    > What would be a good approach to take to do something as simple as
    >,
    > not to mention that I'm creating something that "looks like" a
    > table
    > without the use of tables?
    >
    > Thank you,
    > ~ Greg
    >

  • Style CSS - background does not show?

    Hello world
    first of all, I'm quite new to the word Dreamweaver and Web design so... Sorry if I make mistakes

    When you try to prewiew on my site, or in dreamweaver itself, I can't see my bottom (made a .png whit photoshop file, slightly degraded some simple effects)
    I tried to use the site manage and set the image by default folded, but this has not solved anything!

    It's my HTML code (oh yes, I write in HTML5 site):

    <! doctype html >

    < html >

    < head >

    < meta charset = "utf-8" >

    < title > Untitled Document < /title >

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

    < / style >

    < / head >

    < body >

    < div id = 'Main' > < / div >

    < / body >

    < / html >

    And the page of CSS styling:

    @charset "utf-8";

    / * CSS document * /.

    {body

    background-color: #03F;

    background-image: url(Images/sfondo.png);

    background-repeat: no-repeat;

    left margin: 0px;

    margin-top: 0px;

    margin-right: 0px;

    margin-bottom: 0px;

    }

    {#Principale}

    do-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;

    background-color: #000;

    float: left;

    height: auto;

    Width: 901px;

    }

    Thanks to you all
    Bye!

    Without seeing the live page it's hard to analyze, BUT here are a number of things, you could look:

    (1) is the name of your folder really Images with an 'I' CAP or is it images with a lowercase 'i'?

    Images/sfondo.png

    (2) is your png file saved as RGB and CMYK color space and not?

    (3) looking at what you have posted the path to your bg image is probably improper

    background-image: url(Images/sfondo.png);

    Should be: (note of the... / before the name of the pictures folder):

    background-image: url (.. / Images/sfondo.png);

  • Problem with the 2.0 (1.0) Spry menu bar re - CSS

    Hello:

    I'm having some trouble with a Spry (horizontal) 2.0 (1.0) menu bar I created.  Initially, I thought the problem was in what concerns the problems of rendering on IE 6.0, but the problem seems to be more general than that, and I came to believe that this has to do with the CSS created by the browser Widget and changed once imported in the Web page.  That's why I chose to post my question here rather than on the spry page.

    I leaned on the tutorial provided by David Powers (Bayside.css) and in addition any other documentation regarding the Spry UI bar menu.  The problem appeared as one of the 6 IE rendered page with a gap that is created when the menus appear, so push down the divs that appear below the page.

    However, through a laborious process of trial and error, my problem now seems to be that when I export the CSS generated by the browser widget to an external style sheet (the style sheet General governing the whole of the site), he comes into conflict with other CSS styles for links etc.  The end result is that all the padding, background colors, background images, and colors of text are lost.  As long as the CSS is in the head that this does not happen.

    My thought is that this must have to do with the problems of specificity, inheritance, etc.

    The site is available at the following ADDRESS: http://www.aclco.org/testing/index.html.  In its current form, all the CSS associated with the menu bar is located at the head of each page.  (see CSS below).

    My question is I can set up a separate style sheet for the menu bar horizontally and have these styles applied specifically (and only) in the menu bar my only alternative is to work through the rest of the General style sheet and the work by problems of specificity/inheritance - that may be the "best" practice , but it may create another 'cascading' [sic] problems elsewhere.

    Advice or suggestions or directed readings (which would point to a solution) that could be offered would be greatly appreciated.

    Steve Webster

    The horizontal CSS governing the menu bar is as follows: (currently the following CSS is embedded in the web page's head)

    < style type = "text/css" >

    / * - Start styles horizontal Spry Menu Widget 2.0 (1.0) menu bar-* /.


    / * BeginOAWidget_Instance_2141544: #MenuBar * /.
    / * Values for skinning a basic through presets menu. If the default settings are not sufficient, most count should be done in
    These rules, except for the images used to down or to the right pointing arrows, located in the SpryMenuBasic.css file

    They take the following classes of widget for layout of menu (located in a "Preset")
    . MenuBar - applies to all menu bars - default is a horizontal bar, all submenus are vertical - level 2 subs and beyond are drop down to the right.
    . MenuBarVertical - vertical main bar; All submenus are drop down to the right.

    You can also pass in extra classnames to set your desired top-level menu bar layout. Normally, they are defined by using a predefined setting.
    They apply only to the horizontal menu bars:
    MenuBarLeftShrink - the menu bar will be horizontally "shrinkwrapped" be just big enough to hold his items and left-aligned
    MenuBarRightShrink - as MenuBarLeftShrink, but right-aligned
    MenuBarFixedLeft - set to a specified width defined in rule "." MenuBarFixedLeft', and left-aligned.
    MenuBarFixedCentered - Fixed to a specified width defined in rule "." MenuBarFixedCentered',.
    and centered in its parent container.
    MenuBarFullwidth - expands to fill the width of the parent container.

    In general, all the rules specified in this file are prefixed by #MenuBar so that they don't apply to instances of the widget inserted along
    with the rules. This allows use of multiple MenuBarBasic widgets on the same page with different layouts. Due to limitations in IE6.
    There are a few rules where this was not possible. These rules are so noted in the comments.

    */

    {#MenuBar}
    background-color: transparent;
    do-family: Arial, Helvetica, without serif. / * Specify the fonts on the bar menu and submenu MenuItemContainer, so MenuItemContainer.
    MenuItem and MenuItemLabel
    at a given level all use the same definition for ems.
    Note that this means that the size is also inherited from the submenus of the child,
    so be careful when using other than relative sizes
    100% on the fonts submenu. */
    make-weight: normal;
    font size: 17px;
    make-style: normal;
    padding: 0;

    }
    / * ATTENTION: because ID + class selectors do not work correctly in IE6, but we want to restrict these rules to all this
    instance of widget, we used the concatenated string classnames to our selectors for the type of layout of the menu bar
    in this section. These have very low specificity, so be careful not to overstep accidentally. */

    . MenuBar br {/ * using only a class, so there same specificity that the "."} MenuBarFixedCentered br' rule bleow * /.
    display: none;
    }
    . {MenuBarLeftShrink}
    float: left; / * shrink the content, but also to float the menu bar * /.
    Width: auto;
    }
    . {MenuBarRightShrink}
    float: right; / * shrink the content, but also to float the menu bar * /.
    Width: auto;
    }
    . {MenuBarFixedLeft}
    float: left;
    Width: 80em;
    }
    . {MenuBarFixedCentered}
    float: none;
    Width: 80em;
    margin-left: auto;
    margin-right: auto;
    }
    . MenuBarFixedCentered br {}
    Clear: both;
    Display: block;
    }
    . MenuBarFixedCentered. Submenu br {}
    display: none;
    }
    . {MenuBarFullwidth}
    float: left;
    Width: 100%;
    }

    / * Top level bar small objects - these actually apply to all items and get substituted for the submenus level 1st or successive * /.
    #MenuBar. {MenuItemContainer}
    padding: 0px 0px 0px 0px;
    margin: 0;     / * Zero margin on the containers of items. The MenuItem is the active area of hover.
    For most elements, we have padding top or bottom or border only on MenuItem
    or a child so we keep all tiled submenu with elements.
    Definition of this 0 avoids the "dead zones" to hover. */
    }
    #MenuBar. {}, MenuItem
    padding: 10px 10px 10px 4px;
    background-color: #000088;
    background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/navigation%20Bar%20Segm ent - Dark.png);
    background-repeat: repeat-x;

    }
    #MenuBar. {MenuItemFirst}
    border-style: none none no none;
    }
    #MenuBar. {MenuItemLast}
    border-style: none none no none;
    }

    #MenuBar. MenuItem. {MenuItemLabel}
    text-align: center;
    line-height: 1.4em;
    color: #ffffff;
    background-color: transparent;
    padding: 0px 18px 0px 5px;
    Width: 10em;
    Width: auto;
    }
    . SpryIsIE6 #MenuBar. MenuItem. {MenuItemLabel}
    Width: 1em; / * Equivalent to min-width in modern browsers * /.
    }

    / * First level of submenu items * /.
    #MenuBar. Submenu. {}, MenuItem
    do-family: Arial, Helvetica, without serif.
    make-weight: bold;
    font size: 15px;
    make-style: normal;
    background-color: #000088;
    padding: 0px 2px 0px 0px;
    border-width: 0px;
    border color: #cccccc #cccccc #cccccc #cccccc.
    / * Border styles are replaced by first and last items * /.
    border-style: solid solid no solid;
    }
    #MenuBar. Submenu. {MenuItemFirst}
    border-style: none;
    padding: 0px;
    }
    #MenuBar. Submenu. MenuItemFirst. {MenuItemLabel}
    padding-top: 0px;
    }
    #MenuBar. Submenu. {MenuItemLast}
    border-style: none none no none;
    }
    #MenuBar. Submenu. MenuItemLast. {MenuItemLabel}
    padding-bottom: 10px;
    }
    #MenuBar. Submenu. MenuItem. {MenuItemLabel}
    text-align: left;
    line-height: 1em;
    background-color: transparent;
    color: #ffffff;
    padding: 10px 10px 10px 10px;
    Width: 240px;

    }

    / * Hover States for containers, objects and labels * /.
    #MenuBar. {MenuItemHover}
    background-color: #2E35A3;
    background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/navigation%20Bar%20Segm ent%20Light2.png);
    background-repeat: repeat-x;

    }

    #MenuBar. MenuItemWithSubMenu.MenuItemHover. {MenuItemLabel}
    background-color: transparent; / * expose this propeller separately * /.
    color: #ffffff;
    }
    #MenuBar. MenuItemHover. {MenuItemLabel}
    background-color: transparent;
    color: #ffffff;
    }
    #MenuBar. Submenu. {MenuItemHover}
    background-color: #2E35A3;

    }

    #MenuBar. Submenu. MenuItemHover. {MenuItemLabel}
    background-color: transparent;
    color: #ffffff;
    }
    / * The submenu - first-level submenus properties * /.
    #MenuBar. {SubMenuVisible}
    background-color: transparent;
    min-width: 0%;  / * This prevents the menu being lean that the parent MenuItemContainer - but not available on ie6 nice to have * /.
    border-style: none none no none;
    }
    #MenuBar.MenuBar. SubMenuVisible {/ * menu bar horizontally for only * /}
    top: 100%;    / * 100% is at the bottom of menuItemContainer parent * /.
    left: 0px; / * "left" may need tuning according to borders or padding applied to the bar MenuItemContainer or MenuItem,.
    and your personal taste.
    0px align left drop-down list with the content of the MenuItemContainer area. Assuming you keep the margins 0
    on MenuItemContainer and on the parent MenuItem
    menu bar, which in fact equals the sum of padding-left MenuItemContainer & MenuItem align
    the drop-down menu to the left of the menu item label.*.
    z-index: 10;
    }
    #MenuBar.MenuBarVertical. {SubMenuVisible}
    Top: 0px;
    left: 100%;
    min-width: 0px; / * Do not neeed to match the width of the parent MenuItemContainer - elements will avoid total collapse * /.
    }
    / * The sous-menu--deuxieme submenu level properties and beyond - are visible to descendants. MenuLevel1 * /.
    #MenuBar. MenuLevel1. {SubMenuVisible}
    background-color: transparent;
    min-width: 0px; / * Do not neeed to match the width of the parent MenuItemContainer - elements will avoid total collapse * /.
    Top: 0px;    / * If you want, you can move this down a smidge to separate the top item "submenu s of menubar.
    It is really necessary only for the submenu on the first point of MenuLevel1, or you can make it negative to make the submenu
    vertically 'centered' about his call to * /.
    left: 100%; / * If you want to move the submenu on the left to partially cover the point of his call, you can add a margin to the left with a
    negative value to this rule. Alternatively, if you use the elements of fixed width, you can change this value on the left
    to use px or ems to get the desired offset. */
    }
    / * IE6 rules - you can remove these if you do not want to support IE6 * /.

    / * Note about several classes in IE6.
    Some rules above use several class names to an element of selection, such as "hover" (MenuItemHover) and 'a a submenu' (MenuItemWithSubMenu).
    * give the selector '. MenuItemWithSubMenu.MenuItemHover'.
    * Unfortunately, IE6 does not support using mutiple classnames in a selector for an element. For a selector like '. foo.bar.baz', IE6 does not take into account
    * all but the final classname (here, ".baz") and defines the specificity in consequence, with only one of these classs as significant. To work around this problem
    * problem, we use the plugin in SpryMenuBarIEWorkaroundsPlugin.js to generate classnames for IE6, such as "MenuItemWithSubMenuHover".
    * Given that many of these necessary, the plugin does not generate additional classes for modern browsers, and we use the copies of CSS2 style class
    * syntax for that. Since IE6, both apply the rules where the
    * It should not and gets the specificity wrong too, we have rules of order carefully, then misapplied rule in IE6 can be overridden.
    * So we put first the multiple class rule. IE6 wrongly apply this rule.  We follow this with the single class rule that it would be
    * replace by mistake, by ensuring that the specificity of IE6 interpreted as is the same as the unique class selector, so the latter wins.
    * We then create a copy of the rule of multiple class, adding a "." SpryIsIE6' in the context of the class and to ensure that the specificity
    * the selector is high enough to beat the rule of single class in the case of "match of these two classes. We place the rule of IE6 at the end of the
    * block of css styling to make it easy to remove if you want to drop support for IE6.
    * If you decide you do not need IE6 support, you can get rid of these, as well as the inclusion of the SpryMenuBarIEWorkaroundsPlugin.js script.
    * The 'SpryIsIE6' class is placed on the HTML element by the script in SpryMenuBarIEWorkaroundsPlugin.js if the browser is Internet Explorer 6. This avoids the need of IE conditional comments to these rules.
    */
    . SpryIsIE6 #MenuBar. MenuBarView. MenuItemWithSubMenuHover. MenuItemLabel / * selector IE6 * /}
    background-color: transparent; / * expose this propeller separately * /.
    color: #ffffff;
    }
    . SpryIsIE6 #MenuBar. MenuBarView. Submenu. MenuItemWithSubMenuHover. MenuItemLabel / * selector IE6 * /}
    background-color: transparent; / * expose this propeller separately * /.
    color: #ffffff;
    }
    . SpryIsIE6 #MenuBar. Submenu. Submenu / * selector IE6 * /}
    left margin:-0px; / * Offset at least part of a version of 'double upholstery' bug IE6 'double margin "* /.
    }


    / * EndOAWidget_Instance_2141544 * /.

    / * End Spry Menu Bar Widget 2.0 (1.0) Horizontal Menu Custom styles * /.


    < / style >

    The CSS for the site in general is reproduced below: (my belief is that it is a: link, a: visited, a: hover, a: active styles that may be in conflict).

    @charset "utf-8";


    {body
    Police: 100% Verdana, Arial, Helvetica, without serif.
    min-height: 0; / * this is necessary to overcome the "haslayout" bug found in Windows 7 in conjunction with IE8.  For more information see: URL - http://reference.sitepoint.com/css/haslayout.html * /
    margin: 0; / * It is advisable to zero, the margin and the filling of the body to hold element has a different default browser * /.
    padding: 0;
    text-align: center; / * This allows the centering of the container and overcomes an inherent bug in IE 5 * /.
    Color: #000000;
    list-style-image: none;
    background-color: #FCFCFC;

    }

    H1, h2, h3, h4, h5, h6 {}

    color: #000066;

    }

    a: link {}
    color: #151A 96.
    text-decoration: underline;
    }
    a: visited {}
    text-decoration: underline;
    color: #1B8DCD;
    }
    a: hover {}
    text-decoration: none;
    color: #F30A0A;
    }
    a: active {}
    text-decoration: underline;
    color: #151A 96.
    }

    #container {}
    Width: 960px;
    margin: 0 auto; / * margins (in conjunction with a width) auto Center the page * /.
    text-align: left; / * This setting overrides the text-align: center on the body element. */
    background-image:
    URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Midsection%20_960.png);
    background-repeat: repeat-y;
    }

    #header {}
    padding: 0;  / * This filling is the alignment to the left of the items in the div that appear below. If an image is used in the #header instead of text, you can remove the padding. */

    Width: 960px;
    height: 332px;
    background-image:
    URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Header_960.png);
    background-repeat: repeat no.;
    }


    #header h1 {}

    margin-right: 0px; / * zero setting of the margin of the last element in the #header div tag will prevent the collapse of margin - inexplicable space between divs. If the div has a border around it, this isn't necessary, which also allows to avoid the collapse of margin * /.
    padding: 0; / * padding instead of margin will allow you to keep the edges of the div element * /.
    display: none;

    }

    #header img {}
    display: none;
    }

    {#Main_nav_contents}
    padding: 0;
    margin-top: 0px;
    height: 39px;
    Width: 950px;
    padding-top: 275px;
    padding-left: 39px;
    z index: 3;

    }

    {#MenuBarVertical}
    margin-bottom: 50px;
    padding-top: 50px;
    padding-bottom: 200px;
    padding-left: 15px;
    padding-right: 15px;

    }


    {.mainContent_left}
    margin: 0; / on this div element right margin creates the column on the right side of the page - no matter how content div the sidebar1″ contains, the space of the columns will remain. You can remove this line if you want the #mainContent div text to fill the space of #sidebar1 when the content of #sidebar1 is complete. */
    padding-left: 30px;
    padding-right: 20px; / * Remember that the fill is space inside the box of div and margin is the space outside the div box * /.
    Width: 600px;
    float: left;
    }


    {.sidebar_right}
    float: right; / * because this element is floating, it takes a width * /.
    Width: 270px; / actual width of this div, in browsers comply with the standards, or the standard mode of Internet Explorer includes the padding and border in addition to width * /.
    top of the margin: 30px;
    margin-left: 0;
    margin-right: 10px;
    font-size: 90%;

    }

    {.mainContent_right}
    margin-left: 10px;
    padding-left: 30px;
    padding-right: 20px;
    Width: 600px;
    float: right;

    }

    {.sidebar_left}
    float: left; / * because this element is floating, it takes a width * /.
    Width: 270px; / actual width of this div, in browsers comply with the standards, or the standard mode of Internet Explorer includes the padding and border in addition to width * /.
    top of the margin: 30px;
    margin-left: 30px;
    margin-right: 0;
    overflow: hidden;
    font-size: 90%;

    }

    {.main_content_centered}
    Width: 650px;
    margin left: 155px;

    }

    {.main_content_centered_header}
    margin left: 75px;


    }

    {.sidebar_textbox}
    margin: 0px;
    Width: 260px;
    padding: 2px;
    }


    {.sidebar_textbox_header}

    Width: 255px;
    height: 58px;
    background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/portrait%20Textbox%20he ader.png);

    }

    {.sidebar_textbox_background_middle}

    Width: 255px;
    padding-top: 12px;
    padding-bottom: 10px;
    background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/portrait%20Textbox%20Mi ddle.png);
    background-repeat: repeat-y;
    }

    {.sidebar_textbox_content}
    / * The width and filling are fixed as follows to reflect the quirks in the rendering of the browser while ensuring that the text is contained in the background of the text box * /.

    Width: 230px;
    padding-left: 20px;
    padding-right: 40px;
    }

    {.sidebar_textbox_footer}

    Width: 255px;
    height: 64px;
    background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/portrait%20Textbox%20Foo ter.png);

    }

    #issues_menu a: link {}
    color: #151A 96.
    text-decoration: none;
    make-weight: bold;

    }


    #issues_menu a: visited {}
    color: #151A 96.
    make-weight: bold;
    text-decoration: none;

    }

    #issues_menu a: hover {}
    color: #F30A0A;
    make-weight: bold;
    make-style: oblique;
    text-decoration: none;

    }

    #issues_menu a: active {}
    color: #151A 96.
    make-weight: bold;
    text-decoration: none;

    }

    {#archives}
    padding-top: 15px;
    padding-right: 15px;
    padding-bottom: 20px;
    padding-left: 0px;

    }

    {.landscape_textbox}
    Width: 500px;
    margin-right: 0px;
    margin left: 30px;
    padding-top: 35px;.
    padding-bottom: 25px;
    make-style: normal;
    make-weight: normal;

    }

    {.landscape_textbox_hdr}

    Width: 500px;
    height: 38px;
    margin: auto;
    padding: 0;
    background-image:
    URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Landscape%20Textbox%20Header.png);

    }

    {.landscape_textbox_middle}

    Width: auto;
    margin: auto;
    padding-top: 12px;
    padding-bottom: 12px;
    background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/landscapte%20Textbox%20 Middle.png);
    background-repeat: repeat-y;

    }

    {.landscape_textbox_content}

    Width: 450px;
    Padding: 25px;
    }

    {.landscape_textbox_ftr}

    Width: 500px;
    height: 44px;
    margin: auto;
    padding: 0;
    background-image: url (.. /ACLCO%20Graphics%20-%20Web%20Site%20Parts/Landscape%20Textbox%20F ooter.png);

    }


    #footer {}
    padding: 0; / * This filling is the alignment to the left of the items in the div that appear above him. */
    Width: 960px;
    height: 222px;
    background-image:
    URL (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Website%20Footer%20_960.png);
    background-repeat: repeat no.;

    }

    #footer p {}
    margin: 0px; / * zero setting the margins of the first element in the footer will avoid the possibility of the collapse of the margin - a space between the div tags * /.
    padding: 0px; / * padding on that element will create space, just as it would the margin, free margin collapse question * /.
    text-align: center;
    margin-left: 50px;
    right margin: 50px;
    padding: 10px;
    font size: small;
    }

    #footer h5 {}

    text-align: center;

    }

    .fltrt {/ * this class can be used to float right to the item in your page.} The floating element must precede the element it should be next to the page. */
    float: right;
    left margin: 8px;
    }
    .fltlft {/ * this class can be used to float an element on your page to the left * /}
    float: left;
    right margin: 8px;
    }
    .clearfloat {/ * this class must be placed on an element div or break and should be the last item before closing a container should completely contain a float * /}
    Clear: both;
    height: 0;
    font size: 1px;
    line-height: 0px;
    }


    {.dropcap}
    display: block;
    float: left;
    line-height: 80%;
    font size: 250%;
    make-weight: bolder;
    color: #000066;
    Padding: .1em .03em 0 0;
    }

    {.red_arrows}
    list-style-position: outside;
    list-style-image: url (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Arrow%20Large.png);
    }

    {.blue_bullets}
    list-style-position: outside;
    list-style-image: url (.. / ACLCO%20Graphics%20-%20Web%20site%20Parts/Bullet%20Medium%20Full.png);
    }

    attention {}
    color: #F30A0A;
    font-size: x-large;
    do-family: Georgia, "Times New Roman", Times, serif;
    make-style: italic;
    Police-weight: 900;
    }

    {.attention_small}
    color: #F30A0A;
    font size: large;
    do-family: Georgia, "Times New Roman", Times, serif;
    make-style: italic;
    Police-weight: 900;
    }

    .table {}
    table-layout: fixed;

    }
    . Blue {}
    Color: #00F;
    }
    #container .mainContent_left p .blue {}
    color: #0303A 0;
    }

    Hello Steve

    Well, I checked your page in IE6 and it seems to work fine for me except that here seemes to be a little space between

  • items that may be due to lack of support of .png?  In other words, if there is a little transparency on the edge of the chart?  Maybe it's more a shot in the water on my part!

    Now my suggestion to you would be to mark this thread as closed/replied and after again with just the link to the page and your question.  Short is sweet.

    Martin

  • Why no Support information about the browser.display.focus_ring_style entry in the config file? Why I can't change the color of the ring update via the config file?

    Currently, using Ver38.
    Used to change the color of focus ring & screws of css styling to help see what link has focus.
    Methods via ' subject: config' to change any focus ring settings are too restrictive.
    Impossible to find info on the entrance of config file of ' browser.display.focus_ring_style.

    This code must be inside the userContent.css file.

  • Control the Webview fonts dynamically

    I'm trying to allow the user to control the size of the font in a webview. The settings.minimumFontSize attribute does nothing.

    Any ideas?

    Thank you

    I recommend that you inject some CSS styling forand/or

    using evaluateJavaScript(). There are instructions for setting the size of the text for different items here.

    wantoun wrote:

    I'm trying to allow the user to control the size of the font in a webview. The settings.minimumFontSize attribute does nothing.

    Any ideas?

    Thank you

Maybe you are looking for

  • ENVY 15-k006tx: does not fingerprint reader

    Recently, I upgraded to win 10 (64-bit) Home from 8.1 to win. Since then, he had problems with the fingerprint reader.  I can start the machine by sliding my finger, but after the screensaver login screen, I couldn't. From there, I could use only PIN

  • I find that a series of 5 Microsoft (R) updates fail to install with error 646, despite various recommendations. How can I restart my PC?

    This problem occurs when my operating system from Vista on a HP (R) Slimline s3220n, 2 GB of RAM, try to load the Microsoft updates. 646 error always appear, could not download.

  • I forgot the password of vi

    Tried them all can password remembered, always impossible to open. Written by me, a long time ago, very important suggestions, thx.

  • Bluetooth stack

    I have a pavilion g7-1310us laptop and I get a message when restarting saying battery bluetooth cannot be started.  Broadcom 20702 Bluetooth 4.0 card hardware id is: USB\VID_0A5C & PID_21E3 & REV_0112 USB\VID_0A5C & PID_21E3 What should I do to fix t

  • KB2288953

    When this Ko is installed, I get a Just-In-Time debugging error when I run Outlook 2007. To make things worse. Without the KB installed IE9 Beta crashes with the error message. I have uninstalled the KB naturally and also uninstalling IE 9 Beta. What