La Conversión De La Tabla De Diseño Para Div

Question

Estoy implementando un comentario de control que utiliza un ASP.Repetidor para mostrar cada uno de los comentarios.El comentario en sí es actualmente muestra el uso de una tabla para dividir algunas imágenes para mostrar el comentario en una burbuja.

Sé que las tablas que se supone que es el epítome del mal para el diseño de la web, y muy caro para mostrar para el navegador, pero no estoy exactamente seguro de cómo poner mi esquinas redondeadas en la ubicación correcta y asegurarse de que todo se alinea.

¿Alguien tiene alguna sugerencia, ejemplos, hacks para el HTML/CSS necesario, o debo seguir con tablas y esperar lo mejor?

Answer 1

El mejor recurso que hemos visto para crear esquinas redondeadas mediante elementos DIV, fue un artículo en "Una Lista Aparte" - ver http://alistapart.com/articles/customcorners/.Si usted está buscando para utilizar los elementos DIV de diseño de todo el sitio, hay varios otros artículos pertinentes en ese sitio.Ver:

http://alistapart.com/articles/slidingdoors/
http://www.alistapart.com/articles/slidingdoors2/
http://www.alistapart.com/articles/negativemargins/

Answer 2

Hay un par de maneras diferentes para hacer esquinas redondeadas en CSS

Yo prefiero usar CSS de las tablas siempre que sea posible, sólo porque puedo encontrar el código para que sea mucho más fácil de mantener, y esto suena como un proyecto con la perfecta alcance para conseguir sus pies mojados.

Answer 3

En breve usted quiere algo como esto:

<style>
  .start { background-image: url("topofbubble.png"); height: <heightofimage>; }
  .end { background-image: url("bottomofbubble.png"); height: <heightofimage>; }
  .body {background-image: url("sliceofbubblemiddle.png"); }
</style>

...

<div class="comment">
  <span class="start"></span>
  <span class="body">I would like to say that div layouts are far better than table layouts.</span>
  <span class="end"></style>
</div>

Que debe empezar.Yo no trato el código específico y puede hacer un ejemplo completo si es necesario.

Answer 4

Si usted está dispuesto a presentar es decir que los usuarios con aristas, esquinas redondeadas son trivialmente resolver con el border-radius Propiedad CSS.No hay ningún explorador actualmente implementa como una base de la propiedad, sino varios hacer como el prefijo de la propiedad.Por ejemplo, para uso en firefox, tendría que usar la propiedad -moz-border-radius, para Safari, el uso de -webkit-border-radius, etc.