How to translate this html to css? [closed]

It's difficult to tell what is being asked here. This question is ambiguous, vague, incomplete, overly broad, or rhetorical and cannot be reasonably answered in its current form. For help clarifying this question so that it can be reopened, visit the help center. 开发者_运维百科 Closed 12 years ago.

<table>
<tr>
<td>A</td>
<td>B</td>
</tr>
</table>

I think I can replace my td's with div tags, but not sure how.

---

There is no such thing as "translating from HTML to CSS". CSS is used within HTML/XHTML to style/arrange the contents.

If you are asking this question because someone told you "CSS is better than tables", I suggest looking for some much more broad information on CSS for layouts in general.

CSS and HTML are two complementary languages, each with their own specific purposes, which work together to produce web pages. Purists point out (very correctly) that HTML should contain 'semantic' code, and not layout code. CSS should be used to provide layout.

A big source of issues here is that historically, table tags were used for page layout - to create columns within a web page, for example. Therefore, purists like to complain about the use of table tags in HTML for page layout.

But many people take that way too far - incorrectly, in fact - and conclude that HTML table tags should not be used... at all. table tags exist for a reason and should always be used for that reason: to describe tabular data. Then, CSS should be used to style and determine the layout of that data. But some people (again: incorrectly) conclude that ALL tables are 'bad'.

This ignores the fact that CSS and HTML/tables are not at all contradictory or mutually exclusive. They should be used together. Use table tags to describe tabular data, and then use CSS to style that information for display.

---

<style>div { display: table-cell }</style>
<div>A</div><div>B</div>

If that's not what you meant, please be more specific.

---

Depends on specifics...

Could also do

<div style="float:left">A</div>
<div style="float:left">B</div>
<div style="clear:left"> <!-- . --> </div>