Summary of several common CSS Problems

Summary of several common CSS Problems
1. Border Problems

The border is a dotted line]

border:1px dashed #ddd;

[Solid borders]

 border:1px solid #ddd; 

[Tr underlined border in table]

Make the following declaration in css:

 .mytable{border-collapse: collapse;} 

[The cell in the table has a broken border]

2. Some form Problems

[Add optional text information for Single-choice/check]

Note that when the label is used, the value of the for Attribute corresponds to the value of the id attribute of the element in the form.

3. Table Problems

[Alignment of text in td]

[Vertical alignment of td text]

Optional attribute value: top middle bottom baseline

[Horizontal alignment of td text]

Optional attribute value: left right center justify

Set the Row Height in tr]

We do not recommend using the height attribute to hide some content.

Line-height: 15px;/* This attribute is recommended */

[If the content in td is blank]

Please fill in with space characters: & nbsp;
In this way, even if there is no content, it will still fill in the blank

[Tr underlined border in table]

Make the following declaration in css:

 .mytable{border-collapse: collapse;}  tr{border:1px solid #ddd;}

4. Some problems with the scroll bar

[Do not want a scroll bar to appear]

 overflow:hidden;

[Do not want the horizontal scroll bar to appear]

 overflow-x:hidden; overflow-y:auto;

[Do not want a vertical scroll bar]

 overflow-y:hidden; overflow-x:auto;

[Do not want a scroll bar, but the vertical height increases with the content]

 overflow-x:hidden; overflow-y:auto; min-hight :xxx px;

[Note:] using this method, you must ensure that the height of the auto-increment includes padding and margin. Otherwise, a vertical scroll bar will still appear.

Note that the elements in the dom (except the height, margin and padding must also be considered) do not exceed the actual height of the parent container.

[Modify some parameters in the horizontal direction]

[If you want to display a scroll bar, but it appears in the browser border scroll bar]

overflow:visible;