Solved

Is there any way I can get rid of this line break?

Posted on 2016-08-02
3
81 Views
1 Endorsement
Last Modified: 2016-08-08
Here's my code:

<div id="foo" style="display:none; border:1px solid #cccccc; padding:10px; border-radius:10px; margin-bottom:25px;">Products are catgorized according to a Macro Category->Category->Subcategory hierarchy.<br><br>
Below, you'll see all of the Macro Catgories in blue. Below each of the Macro Categories are their corresponding Categories which are listed in a dark grey background. In most, but not all instances, you've got a Subcategory listed under each Category. Those Categories that do not have a series of Subcategories attached to them have an "Edit | Delete" option listed to the right. </div>
<?php include ("help.php"); ?>

Open in new window


Here's how it looks before you hit the link that triggers the Javascript that makes it go from "display:none;" to "display:block;"

Here's the Javascript:

<script type="text/javascript">
<!--
    function toggle_visibility(id) {
       var e = document.getElementById(id);
       if(e.style.display == 'none')
          e.style.display = 'block';
       else
          e.style.display = 'none';
    }
//-->
</script>

Open in new window


The Javascript works fine and the page looks good AFTER you hit the link to make the text visible. Prior to that, however, I've got a problem. There's too much of a gap between the hidden text and the next line. Here's a screenshot:

too many line breaks...
Is there a way to remove the extra line break? Again, it looks great when I click on "here," but prior to that, it looks like it's a mistake and I want an equal amount of carriage returns between my paragraphs.

What do you think?
1
Comment
Question by:brucegust
[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
3 Comments
 
LVL 4

Accepted Solution

by:
Branislav Borojevic earned 250 total points
ID: 41740103
I think the most important part of getting to the bottom of your issue is to see the rest of the code. Because the issue clears out after the button is pressed, the issue seems to lay somewhere else, and is not directly linked to the div that is hidden.

Maybe if you link any CSS that you have for the rest of the content, that might be the culprit.

I doubt that the issue is caused by the script or the div that is hidden initially.
2
 
LVL 22

Assisted Solution

by:Kim Walker
Kim Walker earned 250 total points
ID: 41740105
I agree with Branislav Borojevic. The problem is likely the margins attached to the elements above and below the hidden div. Something is preventing these margins from overlapping when the div is hidden. Then when the div is not hidden, it either has no margin or its margins are being allowed to overlap those above and below. We need to see the code for the other elements and the CSS applied to them. The best way to do this is to give us a link to the actual page.
1
 

Author Comment

by:brucegust
ID: 41747572
I figured it out, gentlemen! Thanks!
0

Featured Post

PeopleSoft Has Never Been Easier

PeopleSoft Adoption Made Smooth & Simple!

On-The-Job Training Is made Intuitive & Easy With WalkMe's On-Screen Guidance Tool.  Claim Your Free WalkMe Account Now

Question has a verified solution.

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

SASS allows you to treat your CSS code in a more OOP way. Let's have a look on how you can structure your code in order for it to be easily maintained and reused.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.
Suggested Courses

622 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