CODEWITHSUNDEEP
cssframeworkscss-tables
Bill
Bill

Reputation: 77

CSS Table Formatting Improperly

I have a problem with formatting a CSS table using the Gumby framework. The first row of the table "grabs" content above it.

I suspect I have some unclosed tag, but I sure cannot find it.

Here is what I think is the releveant css:

<div class="six columns" center-text>
<div id='Tips' >
<h4>Tips for Tops</h4>
                OMITTING TWO PARAGRAPHS OF TEXT
<br><br>                
</div>
<div class="twelve columns center-text"><br><h2>Top Ten Individual Winners at All Clubs This Year<br> <a href="ajax.php?scores/resultIndex"> See All Club Results</a></h2><br>

</div>

<div id="response">

<div class="CSS_Table_Example"  style="width:100%">
<table style="margin: auto;">
<tr>
<td>
etc.

The first row of the table put a border around the sides of the containing the "Top Ten..."

You can see the issue on a draft page at:

http://billhogsett.com/Whist/ajax.php?scores/index

The right hand column contains a table 50% of the time so you may need to reload a few times to see the issue.

I hope this is enough information to allow someone to solve my dilemma.

Upvotes: 0

Views: 261

Answers (1)

sylwia
sylwia

Reputation: 381

Remove background from the div or set a width so it won't go out. And set border: none for the CSS_Table_Example class to get rid off the border around. Hope this is answers your question.

btw. don't use <br> to put some space, use margin property instead.

Upvotes: 2

Related Questions