Applying css rule to column in a html table?

Im trying to get variable images to be resized with in a table, in one column, to have a standard size on display. Ive googe'd just about every thing i can think of to try find an answer. Being newb to dreamweaver i might not know the correct wording, relating to what im trying to achive.
So if someone could help, would be great .
Also, would a spry data set display the images acording to the css rule?
edit: from what ivé gathered, do I just give the column a col id and the apply the css rule? If so where would the id fit into the column code?
<tr>
    <th width="100" scope="col">example</th
</tr>

Im trying to get variable images to be resized with in a table, in one column, to have a standard size on display.
You should crop, resize and save images for the web in your graphics editor first.  If you have many images, use batch commands or actions to apply resizing to all images in a folder. Then insert images into table cells.
Nancy O.
Alt-Web Design & Publishing
Web | Graphics | Print | Media  Specialists
www.alt-web.com/
www.twitter.com/altweb
www.alt-web.blogspot.com

Similar Messages

  • How do you write an output in columns to an html table?

    Ive written two programs. My first program compares the difference of two text files and prints the differences in an output. My second program creates a simple Html table. I would like to write my output to this table. How would I go about doing this in java?
    Thanks in advance for your help.

    Thanks guys for the insight. Im very new to java so I'm a complete novice when it comes to writing code. What I came to realize was I needed to do was build a dynamic table. My issue was that I was building a static table and I couldint populate the table with my results. Below is an example of the code I wrote for my table. My apologies if didnt format my code correctly.
    import java.io.BufferedWriter;
    import java.io.File;
    import java.io.FileWriter;
    import java.io.IOException;
    import java.util.Set;
    public class HtmlDataTable {
      public void writehtmltable(Set<String> filenameSet){
      //creates table in the following path
      File htmltable = new File("C:/Output.html");
      try {
      BufferedWriter bw = new BufferedWriter(new FileWriter(htmltable));
      //write html data table
      bw.write(htmltop);
      for (String jarfilename:filenameSet){
      String line="<tr>  <td> </td>      <td> </td> </td>      <td>"+jarfilename + " </tr>";
      bw.write(line);
      bw.write(htmlbottom);
      //close the resource
      bw.close();
      } catch (IOException e) {
      e.printStackTrace();
    private static String htmltop = "<!DOCTYPE html>\n"+
                                      "<html>\n"+
                                         "<head>"+
                                         "<title>Jar Filename Existance Check</title>"+
                                         "<style>"+
                                         "table, th, td {"+
                                         "    border: 2px solid black;"+
                                         "}"+
                                         "</style>"+
                                         "</head>"+
                                         "<body>"+
                                         "<table>\n"+
                                         "   <tr>     <th colspan='100'>" +
                                         "<h3><br>Jarfilename Existance Check</h3>      </th>   </tr>" +
                                         "<th>POM File Data</th> <th>Lib Directory Files</th> <th>Missing Jarfiles</th>";
      private static String htmlbottom = "</table></body></html>";
    public static void main(String[] args) {
      new HtmlDataTable().writehtmltable(null);

  • Applying exiting CSS rules to new HTML item

    It is not possible to apply an existing CSS rule to a new HTML item in DW 2014. For example, I created a new H1 element but I can't apply that to an existing CSS rule so I have to duplicate an existing CSS rule, rename it and then apply the H1 element to that new CSS element.  A real hassle! This should be a simple process that I was easliy able to achieve in previous versions of Dreamweaver. Does anybody know if the next version of DW will let you to link new HTML elements to existing CSS rules?  Or is this a design bug that will be fixed soon?

    You don't understand the power of re-usable CSS classes yet. 
    As an example, let's say I want my heading to be red and centered.  By using the multiple classes feature in DW's properties panel (See screenshot below), I can select both classes from the drop-list in my properties panel and use as often as desired in my documents.  IDs however are unique and limited to one time usage per page. 
    CSS
    .red {color:red}
    .center {text-align:center}
    HTML
    <h1 class="red center">This is red and centered</h1>
    Nancy O.

  • How can I view/edit the CSS rules that apply to an Order Registration Layout ?

    *Note: I am new to web design and I did not create the site that I am working on. I am also very VERY clumsy with CSS at the moment *
    I have just begun using Dreamweaver to work on a Business Catalyst site. I am attempting to edit the CSS of the layout for the Order Registration Form. The CSS is applied from the site-wide template that is assigned to the Order Registration Layout. When viewing the layout in Dreamweaver, it does not display any CSS info for the page. However, when viewing the live page for the Order Registration, it is clear that CSS is adversely affecting the layout.
    Is there a way to link the css rules from the site-wide template to the Order Registration Layout? Or should I just add a new CSS rule directly to the Order Registration Layout (possibly overriding the site-wide template's CSS)?
    Thanks!
    Nate

    I've used Firebug as well as the Webkit developer tools in Chrome and Safari which have surpassed Firebug in my opinion.  But they all suffer from the fact that the changes you make in them have to later be applied to your code which means you have to take the extra steps of trying to remember what all changes you made in Firebug and copying and pasting them back into your files.  Whereas in Dreamweaver you can Inspect, make changes directly to the code in your file, and you're done.    Not happy with the last few changes?  Undo.  Want to start completely over? File > Revert. 
    Dreamweaver has excellent tools for determining what css is being applied to an element and by what means.  And it's a more streamlined and direct workflow where you work directly in your code.   I still use Firebug and the others from time to time though.  But only for very basic "spur of the moment" testing.  And usually only when I don't have immediate access to the raw files.

  • Is there a way to find out which CSS rules are being used by the different html files?

    Is there a way in Dreamweaver CS3 to find out which CSS rules are being used by the different html files, sitewide?
    Thanks - Dave

    Firefox add-on "Web Developer Toolbar" is a must have.  Information > Display Div & Class details.
    https://addons.mozilla.org/en-US/firefox/addon/60
    Another  handy Firefox Add-on  to add to your tool chest is called "Dust-Me Selectors."
    http://www.sitepoint.com/dustmeselectors/
    "It extracts all the selectors from all the stylesheets on the page you're viewing, then analyzes that page to see which of those selectors are not used. The data is then stored so that when testing subsequent pages, selectors can be crossed off the list as they're encountered.
    You can test pages individually, or spider an entire site, and you'll end up with a profile of which selectors are not used anywhere."
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists
    www.alt-web.com/
    www.twitter.com/altweb
    www.alt-web.blogspot.com

  • How Do You Add Multiple CSS Rules to Text?

    Hi everyone, I have these css rules in my css styles window they are all assigned to some text in a cell on my page.
    .Def14grey4 <body>
    .def14grey4 a:link <a>
    .def14grey4 a:visited <a>
    .def14grey4 a:hover <a>
    .def14grey4 a:active <a>
    .def14grey4 a:focus <a>
    How do you add (all of) these styles to the text in the first place, I know how to add the first one (.Def14grey4), you select the text in the cell and choose the rule from the drop-down menu in the css panel, but how do you add the other ones to some text as well, so that it can have the same link properties.
    Basically I have some more text elsewhere on the page and want to assign these rules to that as well.
    thanks Gareth

    You would want to change your order as shown here -
    .Def14grey4 <body>
    .def14grey4 a:link <a>
    .def14grey4 a:visited <a>
    .def14grey4 a:hover, .def14grey4 a:focus <a>
    .def14grey4 a:active <a>
    That way, the hover and the focus states are equivalent.
    How do you add (all of) these styles to the text in the first place, I know how to add the first one
    You don't really.  The 4 bottom selectors say -
    "find an element with a class of 'def14grey4', and style any link inside that element this way"
    So, <span class="def14grey4"><a href="whatever.html">Whatever</a></span> would get the pseudo-class styles, as would any of the following -
    <span class="def14grey4"><a href="whatever.html">Whatever</a></span>
    <td class="def14grey4"><a href="whatever.html">Whatever</a></td>
    <p class="def14grey4"><a href="whatever.html">Whatever</a></p>
    <body class="def14grey4"><a href="whatever.html">Whatever</a></body>
    <div class="def14grey4"><a href="whatever.html">Whatever</a></div>
    <strong class="def14grey4"><a href="whatever.html">Whatever</a></strong>
    and so on.  These examples assume that there isn't some other more specific rule that would apply to the same links.  You need to study up on the CSS cascade and specificity....

  • How do I turn-off the CSS rule dialog?

    I would  like to know how to turn-off the CSS rule dialog.
    I support a user who has been using DreamWeaver for years and was recently forced to upgrade to the new version. None of the hundreds of files in the site he maintains use CSS. While I recognize it is a "better" and "more efficient" way to do things --- IF you're a sofware engineer -- it is not even close to being worth the cost to revise the entire site and retrain this user.
    So, how can i turn off, not just the pop-up, but how I can tell DW to just go ahead and do it the old-fashioned, embedded in the HTML way of doing things?
    All the user wants to do is change the color of some keywords, css is overkill when that's all he's doing.
    We'd go back to the previous version except the office was forced onto Vista and the older version won't run.

    ADDING  FONT  TAGS:
    By David Powers from the help doc:
    http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WSc78c5058ca073340dcda9110b1f693f21-7ce ba.html
    You won't see anywhere to enter such information in the HTML Property inspector. Dreamweaver CS4 does not support <font> tags, except in Code view. The W3C deprecated <font> tags ten years ago, so CS4 decided to get rid of them from the main user interface.
    If you want to add styles to a short selection of text, you have two options:
    1. Create embedded styles in the <head> of the page.
    2. Create inline styles.
    Both are done using the Property inspector in CSS mode (click the CSS button on the left). Select the text you want to style. How and where the style is created depends on what you select in the Targeted Rule field.
    If you select <New CSS Rule>, you can then select the font, size, or colour in the Property inspector. As soon as you choose one of these, you will be prompted to choose a class name, and the location of the new style. To embed the style in the <head> of the page,  select "This document only".
    The name of the class will appear in the Targeted Rule field, and you can add other values to it.
    If you select <New Inline Style> in the Targeted Rule field, you can apply any of the properties in the Property inspector. This wraps your text selection with a <span> tag that contains the CSS properties as an inline style, e.g., <span style="font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif; font-size: 24px;">Styled text</span>.
    http://help.adobe.com/en_US/Dreamweaver/10.0_Using/WSc78c5058ca073340dcda9110b1f693f21-7ce ba.html
    Note:   If you select text in Code view, you can apply font tags by selecting Format > Font from the main menu. This works only in Code view; selecting Format > Font in Design view launches the New CSS Rule dialog box.
    http://www.adobe.com/devnet/dreamweaver/articles/css_best_practices_03.html

  • Developer: web inspector how do I add new css rules

    I have been using web inspector for quite some time. It was a regular part of my development workflow, however, I was surprised when the safari team totally re-vamped the tool in safari 6.
    You use to be able to click on the menu in the styling section of the tool bar and click "Add new rule". Now it appears you can no longer add css rules in this way. Which is a bummer because I used this feature all the time.
    You also, use to be able to double click for a new rule when in the actual stylesheet under the Resources tab. I can no longer do this either. For the life of me, I can't figure out why the safari team would get rid of these valuable options.
    Someone please help.
    These options must still exist, as they are invaluable when working with css in the browser. Does anyone know how to add a new style rule. I read the documentation and I don't see anything about removing this functionality.
    The only way I can find to add a new rule, is through the snippet bar, which is kind of a pain as you have to add the <style> tags every time you add a new rule.
    Also, I can't figure out how to view and elements pseudo classes (i.e. :hover , :checked, etc).
    I have to say, it is a little frustrating as I don't clearly see the benefits of their redesign and it just seems harder to use. It kind of feels like they reskinned and rearranged things just to make it look new and didn't really think through how developers use this tool.
    Does anyone else feel this way with the new safari?
    Maybe I will see the light after a couple of days. I hope so because I am partial to using safari.

    Build your FGLayout prototype page so it works well in all screen sizes (mobile first, then tablet, finally desktop).    To create your home page, SaveAs index.html.   Then SaveAs page2.html, replace content.  Repeat for other site pages.
    Nancy O.

  • Is there a better way to do this?  CSS rules/Background image/tables

    Hi,
    I am designing a site and I have used a table for the banner.  Everytime a different page is displayed, the banner image changes.  I have created .html pages, and I have created a lot of css rules to change the background image.  I think there must be a more efficiant way to do this?
    http://www.taffyproductions.com/test/
    ALSO... I need to figure out how to make the links (hover/active states) work on all the pages... I figured it out on the index page, but I'm sure there is a better css rule?

    Put a div in the head section?  Surely you jest!
    But you do hint at the easy solution - just have an embedded stylesheet in the head of each page that changed the background image only on that page.  No need for any other complexities.
    In other words on page1, change this -
    <link href="outpost.css" rel="stylesheet" type="text/css" />
    </head>
    to this -
    <link href="outpost.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    table#banner { background-image:url(images/banner1.jpg); }
    </style>
    </head>
    and on page2 change it to this -
    <link href="outpost.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    table#banner { background-image:url(images/banner2.jpg); }
    </style>
    </head>
    etc.

  • How to convert html table with all its css properties into excel , by javascript or jQuery

    hi,
    <script type="text/javascript">
    //working java script
    function CreateExcelSheet()
    var x = Table1.rows
    var xls = new ActiveXObject("Excel.Application")
    xls.Workbooks.Add
    for (i = 0; i < x.length; i++) {
    var y = x[i].cells
    for (j = 0; j < y.length; j++) {
    xls.Cells(i + 1, j + 1).Value = y[j].innerText
    } xls.visible = true
    function write_to_excel()
    str = "";
    debugger;
    var mytable = document.getElementsByTagName("table")[0];
    var rowCount = mytable.rows.length;
    var colCount = mytable.getElementsByTagName("tr")[0].getElementsByTagName("td").length;
    var ExcelApp = new ActiveXObject("Excel.Application");
    var ExcelSheet = new ActiveXObject("Excel.Sheet");
    debugger;
    ExcelSheet.Application.Visible = true;
    for (var i = 0; i < rowCount; i++)
    for (var j = 0; j < colCount; j++)
    str = mytable.getElementsByTagName("tr")[i].getElementsByTagName("td")[j].innerText;
    ExcelSheet.ActiveSheet.Cells(i + 1, j + 1).Value = str;
    //new funtion
    function ExportToExcel(mytblId) {
    debugger;
    var htmltable = document.getElementById('Table1');
    var html = htmltable.innerHTML;
    window.open('data:application/vnd.ms-excel,' + encodeURIComponent(html));
    //new funtion 2
    function write_to_excel2() {
    str = "";
    debugger;
    var mytable = document.getElementById("Table1");
    var rowCount = mytable.rows.length;
    var colCount = mytable.getElementsByTagName("tr")[0].getElementsByTagName("th").length;
    var ExcelApp = new ActiveXObject("Excel.Application");
    var ExcelSheet = new ActiveXObject("Excel.Sheet");
    //ExcelSheet.Application.Visible = true;
    for (var i = 0; i < rowCount; i++)
    for (var j = 0; j < colCount; j++)
    debugger;
    // if (i == 0) {
    // str = mytable.getElementsByTagName("tr")[i].getElementsByTagName("th")[j].innerText;
    str = mytable.getElementsByTagName("tr")[i].getElementsByTagName("td")[j].innerText;
    ExcelSheet.ActiveSheet.Cells(i + 1, j + 1).Value = str;
    ExcelSheet.autofit;
    ExcelSheet.Application.Visible = true;
    DisplayAlerts = true;
    CollectGarbage();
    //csss
    function excelExportHtml(Table1, css1)
    debugger;
    if (css1) {
    var styles = [];
    //grab all styles defined on the page
    $("style").each(function(index, domEle) {
    styles.push($(domEle).html());
    //grab all styles referenced by stylesheet links on the page
    var ajaxCalls = [];
    $("[rel=stylesheet]").each(function() {
    ajaxCalls.push($.get(this.href, '', function(data) {
    styles.push(data);
    return $.when.apply(null, ajaxCalls)
    .then(function() {
    return "<html><style type='text/css'>" + styles.join("\n") + "</style>\n" + table.outerHTML + "</html>";
    else {
    return $.when({ owcHtml: Table1.outerHTML })
    .then(function(result) {
    return "<html>" + result.owcHtml + "</html>";
    //new
    function ExportToExcel() {
    $(document).ready(function() {
    $("#btnExport").click(function(e) {
    window.open('data:application/vnd.ms-excel,' + $('#Table1').html());
    alert("jhhklhhklhklh");
    //new
    $(document).ready(function() {
    debugger;
    $("[id$=myButtonControlID]").click(function(e) {
    window.open('data:application/vnd.ms-excel,' + $('div[id$=divTableDataHolder]').html());
    e.preventDefault();
    alert("k");
    function excel()
    {debugger;
    var tableToExcel = (function() {
    var uri = 'data:application/vnd.ms-excel;base64,'
    , template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--></head><body><table>{table}</table></body></html>'
    , base64 = function(s) { return window.btoa(unescape(encodeURIComponent(s))) }
    , format = function(s, c) { return s.replace(/{(\w+)}/g, function(m, p) { return c[p]; }) }
    return function(table, name) {
    if (!table.nodeType) table = document.getElementById(table)
    var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML }
    window.location.href = uri + base64(format(template, ctx))
    </script>
    i have tried all the above java script and jquery to convert an html table to excel, data are exporting correctly but i want that css of the table should also implent to excel thats not happening,even the property defined inside td and tr aare not implementing
    in excel

    Hi avinashk89,
    Welcome to post in MSDN forums.
    This is not the right forum for your question. Please post in
    ASP.NET forums where you could get better support.
    Thanks for your understanding.
    We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
    Click
    HERE to participate the survey.

  • How to apply CSS to Existing Site

    Help! I am a Macromedia Dreamweaver user. I manage a few simple sites on a volunteer basis. I was recently forced by a new computer purchase to upgrade to CS4 for Vista compatibility.
    I have never used Style Sheets. I've spent several hours this afternoon combing the web for instructions and found that most of the information assumes way more knowledge than I have, and the more basic articles seem to provide nice overviews of what CSS is and why one might want to use it, or possibly how to build a new site using CSS, but they have not answered my "how to" questions about my existing sites.
    My two most pressing unanswered question are these:
    1)  I seem to have successfully created a new CSS rule by selecting a section of text in the document, setting the Property Inspector to CSS and then naming the rule and choosing a font style and size (although the new rule dialog box never appeared - I did it all in the Property Inspector). Do I have to go through the whole site and apply this rule individually to each section of body text? The existing document has all the text set by its specific features (e.g. Arial Bold 10), not using "heading 1" "heading 2" etc.
    2) I do not use Dreamweaver to upload my finished documents. I use a site-managemet ftp page on my host server. Once I've created these CSS style rules, is there anyting that I need to upload besides my edited pages?
    Thank you in advance for help.

    If you are using the same font family, font size, colour, etc... you can use a separate style sheet and just use
    body {font-size:14px; font-family:arial, helvetica, sans-serif}
    this will make all your site the same body style.
    Do I have the book for you:  CSS in easy steps by Mike McGrath  isbn#1-84078-301-x
    It's a really good beginner's book to CSS.  And really easy to read!  Was a huge help to me in my beginnings of CSS.
    Also, www.lynda.com is a great resource.
    Hope this helps!
    You'll need to upload that extra css page with the rest of your site!
    Message was edited by: JulesN

  • How to apply CSS to a BC menu

    Hi there,
    I have done a lot of reading, gone to BC gurus, looked at Liam's post on Web Menu V2and I am still stumped on this one. The BC gurus tutorial and Liams' item were way above my head.
    How do you apply CSS you have written to a BC menu?
    I have set up a BC menu and put items in it. The menu type is CSS (HTML) Only
    The menu items have a name, a page link Item Height of 30 and .menuLeft in the Item CSS Class Name
    The template the menu is on is responsive and linked to a stylesheet with the CSS code below in it.
    The menu is completely unaffected by the CSS in the stylesheet. All menu items have a dot in front of them, and look like the default link style for the site.
    So the CSS below is not having any affect on the menu items. Why is this?
    What basic, simple step have I missed here?
    How do I get the menu in BC to notice the CSS below?
    I have also tried making the CSS into an id #menuLeft and putting that into the Item ID Name field in each menu item. The CSS is still completely ignored. Why? (anguished cry)
    .menuLeft {
              list-style-type: none;
    .menuLeft ul{
              list-style-type: none;
              padding: 5px;
              margin: 0px;
              line-height: 30px;
              border: thin solid #CCCCCC;
              border-radius: 3px;
              text-decoration: none;
    .menuLeft li a:link {
              color: #3F823D;
              text-decoration: none;
    .menuLeft li a:visited {
              text-decoration: none;
              color: #999999;
              background-color: #B9E09A;
    .menuLeft li a:hover {
              color: #999999;
              text-decoration: underline;
              background-color: #B9E09A;
    .menuLeft li a:active {
              color: #999999;
              text-decoration: none;
              background-color: #B9E09A;

    Hi Liam,
    The class is definitely .menuLeft and that is what is showing in the code. However, for the menu, only the line height set in the backend of BC is showing. All other styling in the CSS is ignored. By the way I have to have two CSS stylesheets as this is a responsive design using CCDW. You have to use a separate stylesheet to style body, links, headers and other items. I have done this in eternityfonts.css which is where the styling for the menu is. The webpage is using all other instructions from the eternityfonts.css file, including headers, links etc, but it is ignoring the menu styling.
    TEST PAGE SHOWING THE MENU NOT WORKING
    Here is the test page where I am trying to style the menu. http://eternitycosmetics.businesscatalyst.com/test
    It is linked to these stylesheets:
    <link href="/StyleSheets/ModuleStyleSheets.css" type="text/css" rel="StyleSheet" /> BC standard stylesheet with all sites
    <link href="../boilerplate.css" rel="stylesheet" type="text/css"> DW CC stylesheet that comes with fluid design
    <link href="/stylesheets/eternity4.css" rel="stylesheet" type="text/css"> DW CC stylesheet that accompanies the fluid design - the fluid design will break if I edit this stylesheet manually
    <link href="/stylesheets/eternityfonts.css" rel="stylesheet" type="text/css"> stylesheet containing body bground, header, a link and other manual styles for the site. I can edit this stylesheet manually
    CODE RENDERING ON THE PAGE
    Here is the code on the page for the menu in question when I do view source. It appears to be ignoring the .menuLeft code in eternityfonts.css and just looks at the setup in the BC menu.
    <div id="leftMenu" class="fluid"> (this div is in the DWCC generated stylesheet that I cannot touch called /stylesheets/eternity4.css)
    <script type="text/javascript" src="/CatalystScripts/Java_DynMenusSelectedCSS.js"></script><!-- Dynamic Menu Begin CSS Output -->
    <div id="cat_673629_divs">
    <ul id="nav_673629">
    <li class=".menuLeft" style="height:30px;"><a href="/index.htm">Home</a></li> (this class is in the /stylesheets/eternityfonts.css stylesheet that I can edti)
    <li class=".menuLeft" style="height:30px;"><a href="/about-us">About Us</a></li>
    <li class=".menuLeft" style="height:30px;"><a href="/products">About Our Products</a></li>
    <li class=".menuLeft" style="height:30px;"><a href="/impact-cosmetics">Products Online</a></li>
    <li class=".menuLeft" style="height:30px;"><a href="/anti-aging-treatments">Anti-aging Treatments</a></li>
    <li class=".menuLeft" style="height:30px;"><a href="/acne-treatments">Acne Treatments</a></li>
    <li class=".menuLeft" style="height:30px;"><a href="/doctor-services">Doctor Services</a></li>
    <li class=".menuLeft" style="height:30px;"><a href="/testimonials">Testimonials</a></li>
    <li class=".menuLeft" style="height:30px;"><a href="/contact-us">Contact Us</a></li></ul></div>
    <script type="text/javascript">catSetSelectedCSSItem('nav_673629');</script>
    <!-- Dynamic Menu End CSS Output --></div>
    BC MENU SETUP SCREEN
    Here is the BC setup screen showing that I have applied the class of .menuLeft to the menu items:
    CSS CODE THAT IS BEING IGNORED WHEN THE PAGE IS DISPLAYED
    Here is the code in eternityfonts.css that is not being applied to the CSS menu. I have bolded the code that is not being actioned in the BC CSS/HTML menu.
    WHY IS THIS CODE BEING IGNORED?
    What step have I missed here?
    Full dump of code in eternityfonts.css
    @charset "utf-8";
    /* CSS Document */
    body,td,th {
              font-family: Arial;
              font-size: 12px;
              color: #000;
              font-style: normal;
              font-weight: 400;
    body {
              background-color: #FFFFFF;
              background-image: -webkit-gradient(linear, 50.00% 0.00%, 50.00% 100.00%, color-stop( 0% , rgba(178,221,145,1.00)),color-stop( 100% , rgba(255,255,255,1.00)));
              background-image: -webkit-linear-gradient(270deg,rgba(178,221,145,1.00) 0%,rgba(255,255,255,1.00) 100%);
              background-image: linear-gradient(180deg,rgba(178,221,145,1.00) 0%,rgba(255,255,255,1.00) 100%);
              background-repeat: no-repeat;
    a {
              color: #3F823D;
              text-decoration: none;
    a:visited {
              color: #3F823D;
              text-decoration: none;
    a:hover {
              color: #3F823D;
              text-decoration: underline;
    a:active {
              color: #3F823D;
              text-decoration: none;
    h1 {
              font-size: 20px;
              color: #3F823D;
    h2 {
              font-size: 18px;
              color: #FF7546;
    h3 {
              font-size: 16px;
              color: #3F823D;
    h4 {
              font-size: 14px;
              color: #FF7546;
    #buyButton2 {
              width: 100px;
              margin-top: 10px;
              padding-top: 5px;
              padding-bottom: 5px;
              text-align: center;
              border: thin solid #CC6600;
              border-radius: 3px;
              background-color: #FFAC77;
              float: right;
    #buyButton1 {
              width: 100px;
              margin-top: 10px;
              padding-top: 5px;
              padding-bottom: 5px;
              text-align: center;
              border: thin solid #CC6600;
              border-radius: 3px;
              background-color: #FFAC77;
    .menuLeft {
              list-style-type: none;
    .menuLeft ul{
              list-style-type: none;
              padding: 5px;
              margin: 0px;
              line-height: 30px;
              border: thin solid #CCCCCC;
              border-radius: 3px;
              text-decoration: none;
    .menuLeft li a:link {
              color: #3F823D;
              text-decoration: none;
    .menuLeft li a:visited {
              text-decoration: none;
              color: #999999;
              background-color: #B9E09A;
    .menuLeft li a:hover {
              color: #999999;
              text-decoration: underline;
              background-color: #B9E09A;
    .menuLeft li a:active {
              color: #999999;
              text-decoration: none;
              background-color: #B9E09A;
    .menu{
    border:none;
    border:0px;
    margin:0px;
    padding:0px;
    .menu ul{
    height:50px;
    list-style:none;
    margin:0;
    padding:0;
    .menu li ul{
    display:none;
    height:auto;
    padding:0px;
    margin:0px;
    border:0px;
    position:absolute;
    width:200px;
    z-index:200;
    .menu li:hover ul{
    display:block;

  • DW CS3: Template & CSS Rules problems

    Dreamweaver CS3 Templates and CSS Rules.
    I've built a basic html page with a header, navigation links and main content area, then saved this as a template with the content area as the edit region.
    When I create new html pages from this template I want to insert Divs in the edit region for each new page, which I can successfully do, but for some reason Dreamweaver is not allowing me to create new CSS Rules for each new Div? So I'm not able to control position, text layout, colours etc for the new content. So my question is how do I do this?
    I got around this with the current website by creating the template with virtually all of the content for the entire website firstly, then deleting as necessary for each page, which I know is the wrong way to build html site pages from a template!
    I wonder if someone could please point me in the right direction to get me back on track? Any pointers would be very much appreciated.
    Thanks in advance.

    Yes, there is a meta tag at the start of the CSS rules. Here's a copy and paste of the code generated in DW CS3. Template was created from a html doc...
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Untitled Document</title>
    <style type="text/css">
    <!--
    body {
        background-color: #FFFFFF;
        margin-left: 0px;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
    body,td,th {
        font-family: Arial, Helvetica, Helvetica Neue, Verdana;
        font-size: medium;
    #container {
        background-color: #E6E6E6;
        width: 900px;
        margin-right: auto;
        margin-left: auto;
        text-align: center;
    #banner_image {
        padding-top: 5px;
        padding-bottom: 5px;
        background-color: #FFFFFF;
        margin-right: auto;
        margin-left: auto;
    #navigation {
        background-color: #E6E6E6;
        text-align: center;
        padding: 10px;
    #navigation ul {
        margin: 0px;
        padding: 0px;
    #navigation li {
        list-style-type: none;
        display: inline;
        margin-right: 40px;
        margin-left: 40px;
    #navigation a {
        color: #333333;
        font-size: 90%;
        text-decoration: none;
    #navigation a:hover {
        color: #FF3300;
        font-size: 90%;
        text-decoration: none;
    #spacer {
        background-color: #E6E6E6;
        text-align: center;
        padding: 10px;
        margin-top: 10px;
        margin-right: 25px;
        margin-bottom: 10px;
        margin-left: 25px;
        font-size: small;
    #content_area {
        background-color: #666666;
        margin-top: 10px;
        margin-right: 25px;
        margin-bottom: 10px;
        margin-left: 25px;
        padding-top: 20px;
        padding-right: 10px;
        padding-bottom: 20px;
        padding-left: 10px;
    #copyright_footer {
        background-color: #FFFFFF;
        text-align: center;
        padding: 10px;
        font-size: small;
        margin-top: 10px;
        margin-right: 0px;
        margin-bottom: 10px;
        margin-left: 0px;
        clear: both;
    #navigation_lower {
        background-color: #E6E6E6;
        text-align: center;
        padding: 10px;
    #navigation_lower ul {
        margin: 0px;
        padding: 0px;
    #navigation_lower li {
        list-style-type: none;
        display: inline;
        margin-right: 40px;
        margin-left: 40px;
    #navigation_lower a {
        color: #333333;
        font-size: 90%;
        text-decoration: none;
    #navigation_lower a:hover {
        color: #FF3300;
        font-size: 90%;
        text-decoration: none;
    -->
    </style>
    </head>

  • Dw does not recognize css rules.

    As all know when a CSS file opens in Dw in the left side of the window(in the CODER view) we can find the CSS styles pane where the CSS properties are listed.
    When i click to css rule code segment to the open document, automatically, the pane in the left, demonstrates  the relevant properties.
    Lately, this does not happen in a specific CSS document i am working on. It works fine in other documents but in a specific one, this feature does not work-except in very few rules, rules relative to the body tag for instance.
    Why that?
    What might be wrong with other rules and their properties are not demonstrated in the CSS pane?
    Any ides?
    Another strange thing is the fact that when i click the all button in the CSS pane, only 6 rules appear(in the tree structure) despite the fact that the document is full of rules.
    As a result it is only these 6 rules that their properties are listed in the CSS pane when I click the corresponding code segment in the main editor window.

    <Lately, this does not happen in a specific CSS document i am working on...>
    Validate your code and fix reported errors (excluding Spry hacks for legacy browsers).
    Code Validation Tools
    CSS - http://jigsaw.w3.org/css-validator/
    HTML - http://validator.w3.org/
    Nancy O.
    Alt-Web Design & Publishing
    Web | Graphics | Print | Media  Specialists 
    http://alt-web.com/
    http://twitter.com/altweb

  • Export css rules to an external style sheet

    Hi
    For some reason, when i try and right click on my selected styles to move them into a new external style sheet the option to move css rules isn't in bold so i can't perform the task. Its the same when i try and select move css rules from the format tab in my toolbar. Has anyone come across this before or know another way around it. I also seem to get different options appear on my right click depending on what view I am in, is this normal?
    Thanks
    Ellen

    Why don't you manually move your embedded CSS code into a new CSS file (in code view)? 
    Then link your HTML pages to your external style sheet.
    Dreamweaver, Linking HTML to External Style Sheets
    Nancy O.

Maybe you are looking for