CSS/divs vs tables

The ongoing debate on 'Use tables or do not use the tables' does little to shed light on this topic for me. I read articles saying that any good programmer these days should shun tables as if they were riddled with viruses of plague. Other supporters of the tables to minimize the role of the CSS and still others say to use both.

Well, I don't have all day to surf the net looking for answers, then I ask these questions here, in my favorite forum:

Tables become past?
If this isn't the case, when using best wire (encapsulated) div/CSS tables?
Why the harsh difference according to tables against CSS/div?

Right.

Thank you all!

See you soon,.

Wordman

Al,

Thanks for your well worded comments. As for me, I do not use liquid or flexible layouts (if they are the same thing). I find unpleasant liquid layouts for a variety of aesthetic reasons.

CSS is not a huge thing to learn, but without concise help books and forums, it was not a walk in the Park. Tables, I find it too difficult and unruly and as I mentioned in my post to Murray, they do not provide the appearance that I prefer.

I appreciate, however, the points raised in your arguments and the comment left by David. You two had time to explain EXACTLY what I was asking. Thank you two for the effort.

See you soon,.

Wordman

Tags: Dreamweaver

Similar Questions

CSS, DIV and editable regions

Hi all

I am having trouble about a fairly simple dreamweaver model in combination with an external css file. For design purposes, it should be all done using DIV (without tables).

That's what I am looking for: page 80% width, centered:

1 (editable) left header - the header right

2 menu

3 content (editable)

4 footer

It is particularly important that the content (3) can be changed WITHOUT interfering with the other DIV or anything else. Also, the left of the header (1) must be editable, but it is only text or banner or so.

I really hope that someone can help me here, because after hours of research, I'm kindof see letters, no words more ;-)

<!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" />
<!-- TemplateBeginEditable name="doctitle" -->
<title>Testing</title>
<!-- TemplateEndEditable -->
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<link href="../Style/Main.css" rel="stylesheet" type="text/css" />
<script src="../SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
<link href="../SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
</head>
<body class="MainCssClass">
<div id="container">
<div id="header">
<div align="right"><!-- TemplateBeginEditable name="Header" --><!-- TemplateEndEditable -->Header</div>
</div>
<div id="Menubar">
<ul id="MenuBar1" class="MenuBarHorizontal">
  <li><a href="../index.html" title="Home" target="_self">Home</a></li>
  <li><a href="#">Contact</a></li>
  <li><a href="#">About</a></li>
</ul>
</div>
<div id="container">
  <div align="center"><!-- TemplateBeginEditable name="MainContent" -->
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <div id="mainContent">
      <p> </p>
    </div>
    <!-- TemplateEndEditable -->
    <!-- end #mainContent -->
  </div>
</div>
  <div id="footer">
    <p align="center">Footer</p>
<!-- end #footer --></div>
<!-- end #container --></div>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"../SpryAssets/SpryMenuBarDownHover.gif", imgRight:"../SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
</html>

And here is the external STYLE sheet that I use:

@charset "utf-8";
body {
 font: 100% Verdana, Arial, Helvetica, sans-serif;
 background: #666;
 /* margin: 0; it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
 padding 0 0 0 0;
 text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
 color: #CCC;
}
.MainCssClass #container {
 width: 80%;  /* this will create a container 80% of the browser width */
 height: 100%;
 background: #000;
 margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
 padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
 border: 0px;
 text-align: right; /* this overrides the text-align: center on the body element. */
}
.MainCssClass #header 
{
 margin: 0 0 0 0;
 background-color: #FFF;
 color:#000;
 width:100%;
}
.MainCssClass #mainContent {
 padding: 10px 10px 10px 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
 background: #000;
 color:#CCC;
 text-align:center;
 height:auto;
}
.MainCssClass #footer 
{
 margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
 padding: 0 0 0 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
 font-size: small;
 background-color:#666;
}
#divLeft { 
 float:left; 
 width:50%;
} 
#divRight { 
 float:right; 
 width:20%;
}

I've been trying and troubleshooting all afternoon, but I can't seem to find what I'm doing wrong. Can someone advise me on this? I'm afraid it's the nested DIV I mix it up.

Any help would be really appreciated!

Thank you

Mich

CSS:

{body
Police: 100% Verdana, Arial, Helvetica, without serif.
Background: #666;
/ * margin: 0; It is advisable to zero, the margin and the filling of the body to hold element has a different default browser * /.
fill 0 0 0 0;
text-align: center; / * This centers the container in IE 5 * browsers. The text is then set left aligned by default in the #container selector * /.
color: #CCC;
}
. MainCssClass #container {}
Width: 80%; / * This will create one that contains 80% of the width of the browser * /.
Background: #000;
margin: 0 auto; / * margins (in conjunction with a width) auto Center the page * /.
padding: 0; / * Remember that the fill is space inside the box of div and margin is the space outside the div box * /.
border: 0px;
text-align: left; / * This setting overrides the text-align: center on the body element. */
overflow: hidden; / * encapsulates container around the floating elements inside * /.
}
. MainCssClass #header
{
background-color: #0F3;
Color: #000;
overflow: hidden;
}
{#divHeaderLeft}
float: left;
Width: 50%;
}
{#divHeaderRight}
float: right;
Width: 20%;
}
. MainCssClass #content {}
padding: 10px 10px 10px 10px; / * Remember that the fill is space inside the box of div and margin is the space outside the div box * /.
Background: #000;
color: #CCC;
text-align: center;

}
. MainCssClass #footer
{
margin: 0; / * 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: 0 0 0 0; / * padding on that element will create space, just as it would the margin, free margin collapse question * /.
font size: small;
background-color: #666;
}

apply css to a table
Good evening

I am trying to add some css in a table but with not luck at all. I need to be able to add a border of 1px black around her. The cells must be aligned to the top and I need to change the colors of table row, a line would be so one color and the other one. I just can't understand it. Any help would be great. I use an internal style sheet.
Thank you. Here's my code for table.

< body >
< table border = "0" cellspacing = "0" cellpadding = "0" >
< b >
< td > text text text < table >
< td > text text text < table >
< /tr >
< b >
< td > text text text < table >
< td > text text text < table >
< /tr >
< b >
< td > text text text < table >
< td > < p > text text text < /p > < table >
< /tr >
< b >
< td > text text text < table >
< td > text text text < table >
< /tr >
< b >
< td > text text text < table >
< td > text text text < table >
< /tr >
< b >
< td > text text text < table >
< td > text text text < table >
< /tr >
< /table >

< / body >
< / html >

Hello

Here is a page that contains the code I posted previously.
Feel free to copy / paste.

http://tnsgraphics.com/TableRows.htm

Take care
Tim

"snapply" wrote in message
News:gcelcr$35P$1@forums. Macromedia.com...
> Hi Walt,.
>
> My site is not alive and just on my hard drive right now. I'll see if I
> can
> understand this. I just need a few lines of color, but I think I need to
> name
> the table etc. first of all to apply the css. Thank you once again.
>

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.

Is there a better way to do it? Rules CSS/Background image/tables

Hello
I am designing a site and I used a table for the banner. Another page is displayed each time the image of the banner exchange. I created HTML pages, and I created a large number of css rules to change the background image. I think there must be an efficiant way more to do?
http://www.taffyproductions.com/test/
ALSO... I need to find a way to make links (flight hover/active States) knit on all pages... I thought about it on the index page, but I don't know that there is a better css rule?

Put a div in the head section? Surely you jest!

But you hint at the easy way - just have a style sheet embedded in the head of each page that changed the background image only on this page. No need of any other complexities.

In other words on page 1, you can change this.

on this subject.

and on page 2 change to this-

etc.

Divs VS tables

I'm designging a site for my business and Dreamweaver learning as I go. The site I am building will have a quote from video, catalog, produced a vast and contact forms. I had a training in Dreamweaver and CSS in a classroom and online tutorials, all kind of teaching things a little differently. I'm trying to piece everything together to ensure the best way to actaully go on my construction site.
Can someone clarify and/or describe the differences and benefits of building a site with some divs only, or using tables?
Is never beneficial to build your site with Tables and the Divs?
Thank you!

With the help of css (what you call divs) available to your page as opposed to tables not only maintains the markup to a minimum but makes it also much easier for you to maintain your site. For example, with a tag div, you can have a minimum of something like
and then the div style in an external style sheet. The tables are more complex:
. And it's a simple table. When you start the pull-out tables, your markup gets very crowded and more confused. I know. I create websites with tables at the time pre - css. In addition, with formatting CSS, your pages will download faster and better for search engines.

A table is not for page layout (with a few rare exceptions). The use of a table is for tabular data. For example, you can use a table to display your products in your catalog. If you use a table, don't forget to style with css instead of using deprecated html tags.

CSS, div and the AP div tags.
Hi guys, I am building a Web page using a trial version of dreamweaver and I have a few problems with the formatting and CSS.

I'm trying to build a gallery of thumbnails and managed to pretend grand in design mode, by using the 'class' selector (sorry for my terminology if it is false), by placing the thumbnails in an AP div and using the field "box" to set appropriate margins.

But when the preview in internet explore, the images appear up against the div 'container', I said, even if that puts them outside the ap Div they are contained in.

I found a 'solution' - to position elements in design mode so that they display correctly in internet explorer, even if it meant that the left most miniature has a border of 100 instead of 50.

But to complicate things more, this Setup program incorrectly displayed in Safari and Firefox. (The images appear on the far right, but at least identical in both programs).

I also tried to use regular divs and no divs, with similar problems. In fact, often the elements (including text) position I do not appear as they should.

Can someone tell me what is happening and how to fix?

Thanks in advance.
Ben_McPhee wrote:
> Hi guys, I am building a Web page using a trial version of dreamweaver and am
> some problems with formatting and CSS.
>
> I am trying to build a gallery of thumbnails and managed to get it look great
> in design mode, by using the 'class' (sorry for my terminology if selector
(> Is false), by placing the thumbnails in an AP div and using the 'box '.
> fields to set the appropriate margins.
>
> But when you preview in internet explorer, the images appear to the top against the
> div 'container', I said, even if that puts them outside the ap Div
> they are contained in.
>
> I found a 'solution' - to position the elements in design mode for that
> they display correctly in internet explorer, even if it meant that the
> more miniature left has a border of 100 instead of 50.
>
> But to complicate things more, this Setup program incorrectly displays in both
> Safari and Firefox. (The images appear on the far right, but at least identical in the two
(> programs).
>
> I also tried to use regular divs and no divs, with similar problems. In
> fact, often of the elements (including text) position I do not appear as they should.
>
> Can someone tell me what is happening and how to fix?
>
> Thanks in advance.
>

I replied to your post of corss "vignettes of positioning" and suggested that you use a table to do this, since
a table is the best and easiest to create a grid, which is what you want.
If you don't want to use a table, learn CSS and use AP div tags.
Divs are not a viable solution for your problem and are almost never a good idea, although they
are often used by beginners because PA divs can be moved and positioned where you want
the design view. Ease of use is an illusion and creates unexpected problems you encounter.

--
SEB (@webtrans1.com)

high-end web design: http://webtrans1.com

Music: http://myspace.com/popmodelberlin

CSS in the table header

How to apply the color of the table header.
I want to say, suppose I have 3 columns in the table, for each column header, I need to apply a color.

example of table
ID
Status
County
name
Brand
NUM of series
Address
City
State
Zip
Thank you
NGO

Here is the solution

write in the css file.

. {CustomTableheaderColor1}

background-color: rgb (159, 159, 223);

color: black;

make-weight: bold;

}

. {CustomTableheaderColor2}

background-color: rgb (241, 213, 213);

color: black;

}

. {CustomTableheaderColor3}

background-color: rgb (241, 241, 213);

color: black;

}

call this custom in af:column class header styles

Why not adding css class for table poster red border cell error?

JavaFX 2.2.21 Java 7.21

I'm trying to display a red border and a picture on a cell text when an error occurs.

I took the address book example (example 12-11 http://docs.oracle.com/javafx/2/ui_controls/table-view.htm#CJAGAAEE).

and also James D solution to my previous question.

I find that adding a class of css error does not display the red border and the image.

However, using setStyle this - but it is not preferable, because I want to put the border value by default once the error is corrected.

In the example below, red border does NOT appear. The 'name' field was changed to salary and must display one error (red border and image) if other thing that an integer is entered.

If you uncomment the setStyle lines, then it is displayed.

Note: I use empty.png to erase the image of 'failure' because using - fx-background-image: none; somehow, did not.

import javafx.application.Application;
import javafx.beans.property.SimpleStringProperty;
import javafx.collections.FXCollections;
import javafx.collections.ObservableList;
import javafx.geometry.Insets;
import javafx.scene.Group;
import javafx.scene.Scene;
import javafx.scene.control.Label;
import javafx.scene.control.TableColumn.CellEditEvent;
import javafx.scene.layout.HBox;
import javafx.scene.layout.VBox;
import javafx.scene.text.Font;
import javafx.stage.Stage;
import javafx.beans.value.ChangeListener;
import javafx.beans.value.ObservableValue;
import javafx.event.ActionEvent;
import javafx.event.EventHandler;
import javafx.scene.control.Button;
import javafx.scene.control.TableCell;
import javafx.scene.control.TableColumn;
import javafx.scene.control.TableView;
import javafx.scene.control.TextField;
import javafx.scene.control.cell.PropertyValueFactory;
import javafx.scene.input.KeyCode;
import javafx.scene.input.KeyEvent;
import javafx.util.Callback;
public class TableViewSample extends Application {


    private TableView<Person> table = new TableView<Person>();
    private final ObservableList<Person> data =
            FXCollections.observableArrayList(
            new Person("Gates", "46", "[email protected]"),
            new Person("Ellison", "25", "[email protected]"),
            new Person("McNealy", "1", "[email protected]"),
            new Person("Jobs", "0", "[email protected]"),
            new Person("Me", "0", "[email protected]"));
    final HBox hb = new HBox();


    public static void main(String[] args) {
        launch(args);
    }


    @Override
    public void start(Stage stage) {
        Scene scene = new Scene(new Group());
        stage.setTitle("Table View Sample");
        stage.setWidth(450);
        stage.setHeight(550);


        final Label label = new Label("Address Book");
        label.setFont(new Font("Arial", 20));


        table.setEditable(true);
        Callback<TableColumn, TableCell> cellFactory =
                new Callback<TableColumn, TableCell>() {
            public TableCell call(TableColumn p) {
                return new EditingCell();
            }
        };


        TableColumn firstNameCol = new TableColumn("First Name");
        firstNameCol.setMinWidth(100);
        firstNameCol.setCellValueFactory(
                new PropertyValueFactory<Person, String>("firstName"));
        firstNameCol.setCellFactory(cellFactory);
        firstNameCol.setOnEditCommit(
                new EventHandler<CellEditEvent<Person, String>>() {
            @Override
            public void handle(CellEditEvent<Person, String> t) {
                ((Person) t.getTableView().getItems().get(
                        t.getTablePosition().getRow())).setFirstName(t.getNewValue());
            }
        });




        TableColumn salaryCol = new TableColumn("Salary");
        salaryCol.setMinWidth(100);
        salaryCol.setCellValueFactory(
                new PropertyValueFactory<Person, String>("salary"));
        salaryCol.setCellFactory(cellFactory);
        salaryCol.setOnEditCommit(
                new EventHandler<CellEditEvent<Person, String>>() {
            @Override
            public void handle(CellEditEvent<Person, String> t) {
                ((Person) t.getTableView().getItems().get(
                        t.getTablePosition().getRow())).setSalary(t.getNewValue());
            }
        });


        TableColumn emailCol = new TableColumn("Email");
        emailCol.setMinWidth(200);
        emailCol.setCellValueFactory(
                new PropertyValueFactory<Person, String>("email"));
        emailCol.setCellFactory(cellFactory);
        emailCol.setOnEditCommit(
                new EventHandler<CellEditEvent<Person, String>>() {
            @Override
            public void handle(CellEditEvent<Person, String> t) {
                ((Person) t.getTableView().getItems().get(
                        t.getTablePosition().getRow())).setEmail(t.getNewValue());
            }
        });


        table.setItems(data);
        table.getColumns().addAll(firstNameCol, salaryCol, emailCol);


        final TextField addFirstName = new TextField();
        addFirstName.setPromptText("First Name");
        addFirstName.setMaxWidth(firstNameCol.getPrefWidth());
        final TextField addSalary = new TextField();
        addSalary.setMaxWidth(salaryCol.getPrefWidth());
        addSalary.setPromptText("Last Name");
        final TextField addEmail = new TextField();
        addEmail.setMaxWidth(emailCol.getPrefWidth());
        addEmail.setPromptText("Email");


        final Button addButton = new Button("Add");
        addButton.setOnAction(new EventHandler<ActionEvent>() {
            @Override
            public void handle(ActionEvent e) {
                data.add(new Person(
                        addFirstName.getText(),
                        addSalary.getText(),
                        addEmail.getText()));
                addFirstName.clear();
                addSalary.clear();
                addEmail.clear();
            }
        });


        hb.getChildren().addAll(addFirstName, addSalary, addEmail, addButton);
        hb.setSpacing(3);


        final VBox vbox = new VBox();
        vbox.setSpacing(5);
        vbox.setPadding(new Insets(10, 0, 0, 10));
        vbox.getChildren().addAll(label, table, hb);


        ((Group) scene.getRoot()).getChildren().addAll(vbox);
        scene.getStylesheets().add(getClass().getResource("errorTextField.css").toExternalForm());


        stage.setScene(scene);
        stage.show();
    }


    public static class Person {


        private final SimpleStringProperty firstName;
        private final SimpleStringProperty salary;
        private final SimpleStringProperty email;


        private Person(String fName, String pay, String email) {
            this.firstName = new SimpleStringProperty(fName);
            this.salary = new SimpleStringProperty(pay);
            this.email = new SimpleStringProperty(email);
        }


        public String getFirstName() {
            return firstName.get();
        }


        public void setFirstName(String fName) {
            firstName.set(fName);
        }


        public String getSalary() {
            return salary.get();
        }


        public void setSalary(String fName) {
            salary.set(fName);
        }


        public String getEmail() {
            return email.get();
        }


        public void setEmail(String fName) {
            email.set(fName);
        }
    }


    class EditingCell extends TableCell<Person, String> {


        final String errorCSSClass = "error";
        private TextField textField;


        public EditingCell() {
        }


        @Override
        public void startEdit() {
            if (!isEmpty()) {
                super.startEdit();
                createTextField();
                setText(null);
                setGraphic(textField);
                textField.selectAll();
            }
        }


        @Override
        public void cancelEdit() {
            super.cancelEdit();


            setText((String) getItem());
            setGraphic(null);
        }


        @Override
        public void updateItem(String item, boolean empty) {
            super.updateItem(item, empty);


            if (empty) {
                setText(null);
                setGraphic(null);
            } else {
                if (isEditing()) {
                    if (textField != null) {
                        textField.setText(getString());
                    }
                    setText(null);
                    setGraphic(textField);
                } else {
                    setText(getString());
                    setGraphic(null);
                }
            }
        }


        private boolean validate(String text) {
            try {
                Integer.parseInt(text);
            } catch (NumberFormatException ne) {
                return false;
            }
            return true;
        }


        private void createTextField() {
            textField = new TextField(getString());
            textField.setMinWidth(this.getWidth() - this.getGraphicTextGap() * 2);
            textField.focusedProperty().addListener(new ChangeListener<Boolean>() {
                @Override
                public void changed(ObservableValue<? extends Boolean> arg0,
                        Boolean arg1, Boolean arg2) {
                    if (!arg2) {
                        commitEdit(textField.getText());
                        boolean valid = validate(textField.getText());
                        if (!valid) {
                            if (!getStyleClass().contains(errorCSSClass)) {
                                getStyleClass().add(errorCSSClass);
                            }
//                            setStyle("-fx-border-color: red; -fx-background-image:url('fail.png'); -fx-background-repeat: no-repeat; -fx-background-position: right center;");
                        } else {
                            getStyleClass().remove(errorCSSClass);
//                            setStyle("-fx-border-color: gray;  -fx-background-image:url('empty.png');");
                        }
                    }
                }
            });
            textField.setOnKeyReleased(new EventHandler<KeyEvent>() {
                @Override
                public void handle(KeyEvent event) {
                    if ((event.getCode() == KeyCode.ENTER)) {
                        commitEdit(textField.getText());
                        boolean valid = validate(textField.getText());
                        if (!valid) {
                            if (!getStyleClass().contains(errorCSSClass)) {
                                getStyleClass().add(errorCSSClass);
                            }
//                            setStyle("-fx-border-color: red; -fx-background-image:url('fail.png'); -fx-background-repeat: no-repeat; -fx-background-position: right center;");
                        } else {
                            getStyleClass().remove(errorCSSClass);
//                            setStyle("-fx-border-color: gray;  -fx-background-image:url('empty.png');");
                        }
                    } else if (event.getCode() == KeyCode.ESCAPE) {
                        cancelEdit();
                    }
                }
            });
        }


        private String getString() {
            return getItem() == null ? "" : getItem().toString();
        }
    }
}

errorTextField.css

root {
    display: block;
}


.text-field.error {
-fx-border-color: red ;
  -fx-border-width: 2px ;
  -fx-background-image:url('fail.png');
  -fx-background-repeat: no-repeat;
  -fx-background-position: right center;
}
.text-field {
-fx-border-width: 0px ;
-fx-background-image:url('empty.png') ;
   -fx-background-repeat: no-repeat;
  -fx-background-position: right center;
}

The css Setup is fine. The selector

.a.b

Selects elements that have the two class a and class b. Note that in this example, you set the style on the table cell class, not on the text field. So you have the selector

.table-cell.error

You can select the cells of a table with text fields that also have the style class 'mistake' set with

.text-field.error, .table-cell.error

Why export only divs vs tables?

I have a confession to make. I'm still stuck in the world of export of my Web sites out of photoshop in table formats.
Please could someone explain why I should export as divs instead of tables?
Also, is there a way to export a project where each layer or layer groups is a DIV, to avoid cutting the PSD file?
Thanks in advance for your comments!
Micky

Honestly, you don't know what you've been missing out on! Don't bother with the slice function ever. Quite useless, and its existence in Photoshop should be completed as soon as possible (in my opinion).

Better (and free): http://www.cutandslice.me/

Other related practical web taken from photoshop:

http://webzap.uiparade.com/

http://css3ps.com/

http://www.fnordware.com/SuperPNG/

http://GuideGuide.me/

If you are using Windows, do you a favor and get the Quantizr color for png optimal for the web:

http://www.Softpedia.com/get/multimedia/graphic/graphic-others/color-quantizer.shtml

Otherwise, for mac imagealpha will be: http://pngmini.com/

If, however, you are looking for a complete replacement slice in Photoshop which allows for the release of the full web page, try SiteGrinder:

http://www.medialab.com/PSD-to-HTML/why-SiteGrinder.php

Myself, I don't like SiteGrinder, but others like it a lot.

Help please: how to cancel the divs PA Tables

I think I did something stupid! I was playing around in Dreamweaver and I was looking under the tabs > modify > convert > Tables to AP divs. So I clicked on "Tables divs PA" (just to see what he would do) THINKING than what I would have done it I would be able to "undo" - well no, I could not cancel. The page is titled "RequestOrder. Then I opened another page, called "RequestInspection" and it has also seen this page! I opened another site and all pages, titled 'Application [any name]' also has the same effect! All pages that have no "Request" in the title were not conducted.
Can someone please tell me what I did wrong and how to cancel it please? When I look at the pages in the browser, everything seems normal. But I want all of this to go back to the way it was.
I learned my lesson - do not just click on something just to see what he does... usually I don't get in a situation where I can't cancel something.
Thank you very much!
-J
Example of what looks like the page in Dreamweaver:

If you base this 911 call on the appearance of the screen in Design view only? Look in Code view. Do you see tables or div tags? Try using the VIEW | Grid > show grid. He disappears?

Dreamweaver CS5 tags get started CSS Div

I FOLLOWED THE GETTING STARTED TUTORIAL AND GOT THE BANNER DIV, DIV OF MAIN IMAGE AND THE 3 COLUMN DIVSDIVA I TRIED TO CREATE A FOOTER LIKE DIV FOR COPYRIGHT AND CONTACT INFO, BUT THEN IT IS PLACED AT THE END OF THE DIV. RIGHT COLUMN IN OTHER WORDS, IT REMAINS IN LINE WITH THE DIVSDIVA OF THE 3 COLUMN, IT DOESNTDOESN CAN'T FALL BELOW THEM

Without seeing your code, it is difficult to say with certainty, but I think you may have forgotten to clear a float, need you the following css

{.clearfloat}

Clear: both;

height: 0px;

line-height: 0px;

font-size: 1px;

}

then just before your feet of logon page
you need to enter something like

If this doesn't help not could you post a link to your live page or the postal code.

Richard

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>

CSS text-align table that is not interpreted. Always centered!

Sorry I cut/paste wrong field, observed was text-align.

This test in chrome

Caption {}
```
 caption-side: top;
 font-size:16pt;
 width: auto;
 text-align: left;
 background-color: #DDDDDD;
 }
```
as well as other tables, also the background color is missing.

A good place to ask for advice on web development is to the 'Web Standards Development/evangelism' MozillaZine forum.
- http://forums.mozillazine.org/viewforum.php?f=25
Aid to this forum are better informed on issues related to web development.

You must register on MozillaZine forum site to post in this forum.

Table CSS

What is a better way to generate a CSS 3 column table? I use the following but I am convinced that there is a better way. I appreciate your advice.
< div id = "grid700" >
< div class = "table" >
< div class = "th" >
< div class = "title" > Test Table Title < / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "third" >
< div class = "tr short" >
< div class = "td" >
1 Col < h3 > header < / h3 >
< / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "tr short" >
< div class = "td" > < b > Col 1 Row 2 < /b > < / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "tr short" >
< div class = "td" > < b > Col 1 row 3 < /b > < / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "clear" > < / div >
<!-1--> 3 end Col.
< / div >
< div class = "tiers2" >
< div class = "tr short" >
< div class = "td" >
Header 2 Col < h3 > < / h3 >
< / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "tr short" >
< div class = 'td' > Col 2 Row 2 < / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "tr short" >
< div class = 'td' > Col 2 row 3 < / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "clear" > < / div >
<!-2--> 3 end Col.
< / div >
< div class = "tiers2" >
< div class = "tr short" >
< div class = "td" >
3 Col < h3 > header < / h3 >
< / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "tr short" >
< div class = 'td' > Col 3 Row 2 < / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "tr short" >
< div class = 'td' > Col 3 row 3 < / div >
< div style = "" clear: both; "> < / div >"
< / div >
< div class = "clear" > < / div >

< / div >
< div class = "clear" > < / div >
<!-end #grid->
< / div >

When you need a table of tabular data, use a table.

the table header the table header the table header

cell of table 1 table cell 2 table cell 3

Nancy O.

CSS/divs vs tables

Similar Questions

Maybe you are looking for