Solved

HTML page content overflow problems - link supplied

Posted on 2010-11-14
4
257 Views
Last Modified: 2012-06-27
0
Comment
Question by:TonyCabone
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 22

Accepted Solution

by:
remorina earned 125 total points
ID: 34133194
You can set overflow:hidden to #maincolumn_full as below
#maincolumn_full {
margin-left:20%;
overflow:hidden;
padding-left:15px;
width:755px;
}

Open in new window

But this would just cut off your overflown content.

The main reason is your tables, you have the container div (#maincolumn, ) set to 755px wide while there's one of your tables set to 990px wide which is causing the problem.

<table class="MsoNormalTable" style="width: 742.3pt; border-collapse: collapse; border: medium none; margin-left: 6.75pt; margin-right: 6.75pt;" border="1" cellspacing="0" cellpadding="0" width="990" align="left">
<tbody>
<tr>
<td style="width: 304.8pt; padding: 0in 0in 2.85pt;" colspan="2" width="406"><a href="/images/strategy/Stubble Utilisation Strategy.pdf" target="_blank"><img src="/images/M_images/pdf_button.png" border="0" />Click here to download a PDF version.</a><br /></td>
<td style="width: 437.5pt; padding: 0in 5.4pt 2.85pt;" colspan="2" width="583">
<p class="MsoNormal" style="margin-left: -13.5pt; text-indent: 13.5pt;"><em><span style="font-family: &quot;Lucida Handwriting&quot;; letter-spacing: 0.5pt;" lang="EN-AU">Ross   Waller</span></em></p>
<p class="MsoNormal"><span style="font-family: &quot;Comic Sans MS&quot;;" lang="EN-AU">0427186943 <span> </span>mobile contact</span></p>
</td>

Open in new window

As you can see from the code above, you have width: 742.3pt; in the style while in the table properties near the end its width="990"

However, removing the width only from the table won't fix ithe problem straight away since widths are also specified for the table cells that combined totals 990 as well, you need to check the widths of your tables and adjust them, also it's advised to use pixels across all widths, while you seems to be using both pixels and points in some cases.
0
 
LVL 11

Assisted Solution

by:Amanda Watson
Amanda Watson earned 75 total points
ID: 34133196
I think the problem with this particular page is that you have got an article with a table specifying the width as 990px

If you remove that and make it 100% it might help.

Also for this page you probably have you menu item to show the category as a blog layout and to have the articles showing in 2 coloumns, maybe you could reduce this to 1 coloum and change that table width and you might fix it up
0
 

Author Comment

by:TonyCabone
ID: 34133202
Aah I see, this must be due mainly  to content coming out of an MS Word document?
0
 
LVL 11

Expert Comment

by:Amanda Watson
ID: 34133218
yeah definately

Its best to create the tables you need with the WYSIWYG editor in joomla to get the best result
0

Featured Post

Secure Your Active Directory - April 20, 2017

Active Directory plays a critical role in your company’s IT infrastructure and keeping it secure in today’s hacker-infested world is a must.
Microsoft published 300+ pages of guidance, but who has the time, money, and resources to implement? Register now to find an easier way.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Technology Resume 7 67
convert Systemjs to Webpack 3 73
Validating Date 4 28
How to get chosen background-color on every line? 10 17
Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
Find out what you should include to make the best professional email signature for your organization.
In this tutorial viewers will learn how to style a decorative dropcap for the first letter in a paragraph using CSS. In CSS, create a new paragraph class by typing "p.fancy": Then, to style only the first letter of the first sentence, include the ps…
The viewer will receive an overview of the basics of CSS showing inline styles. In the head tags set up your style tags: (CODE) Reference the nav tag and set your properties.: (CODE) Set the reference for the UL element and styles for it to ensu…

763 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question