Table with CSS and align [closed]_问答_开发者_运维开发者技术经验分享

开发者 https://www.devze.com 2023-03-27 09:48 出处：网络

Closed. This question needs debugging details. It is not currently accepting answers. Edit the question to include desired behavior, a specific problem or error, and the shortest code necess

相关专题：css css-tables

Closed. This question needs debugging details. It is not currently accepting answers.

Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.

Closed 4 years ago.

Improve this question 开发者_JAVA技巧

I have a page where I have table with align =center and I have some content inside it and this table is inside the div tag with some CSS class which has background color as blue. If the table property align is center then the background color is coming as blue but when I change the align =left then the background color is not coming (blue color is not coming).

The HTML attributes align="left" (or ="right") on a table are the same as CSS float: left (or right).

Floating removes elements from the normal flow, so that your div with the background color is empty, thus has a height of zero, so you can't see it.

In your case if you just want to align the table to the left and not actually float it, then just leave the align="left" out, because tables align the left by default.

For the future you should learn to use CSS instead of deprecated HTML attributes for the design of web pages. Some steps to do this would be for example:

Make sure your web pages have a strict DOCTYPE instead of Transitional:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Validate your web pages to find any old HTML attributes: http://validator.w3.org/
Learn to use CSS instead: http://htmldog.com/

I looked at your edit history. Now let's assume that you have this code:

<div class="BackgroundDetails">
 <table cellspacing="0" cellpadding="0" width="100%" border="0" align="left">
  <tr>
   <td>
    <table cellspacing="0" cellpadding="0" width="100%" align="left" border="0">
     <tr>
      <td class="MainHeading" align="center">
       Request Form 16  
      </td>
     </tr>
    </table>
   </td>
  </tr>
 </table>
</div>

Add a "table" behind ".BackgroundDetails" to make it work. Or fix width/height for the div. So what you need is this:

.BackgroundDetails table
 {background-color: lightsteelblue;}

Try to use CSS instead of HTML elements like cellpadding, cellspacing, align and so on. This table-in-table-thing is strange but perhaps you have to use this structure. This could be your base: http://jsfiddle.net/t8PuQ/1/

...oooor remove floating like RoToRa advised.