Jump to content

barryg

Members
  • Posts

    6
  • Joined

  • Last visited

Everything posted by barryg

  1. It isn't about an image. Here's the answer I got from another forum: <div id="ai-div-news7"> is set to height 560px as is its parent div, but above #ai-div-news7 there is an <h2> that is forcing #ai-div-news7 down. Changing <div style="float: right; width:517px; height:560px; margin-bottom: 2em;"> to <div style="float: right; width:517px; margin-bottom: 2em;"> fixes the problem. Apparently the Div pushed down the iframe's content. When I take away a specific height, it allows the div to set its own height. I understand some, but not all of it. Thanks for your comment. Barry
  2. 0 down vote favorite Hello! I am trying to style this page: http://techno-french.com/french-news-room and for the life of me, I cannot figure out why the H1 heading, Learn French Online Free with Mots de L’actu is partly obscured by the right floated div above it. I have tried putting 2em of bottom margin on the Div above, and then tried putting top margin on the Div containing the Heading. It works fine in Dreamweaver outside of Wordpress so I suspect the CSS is right, but inside of Wordpress, the heading slips under the Div above it. It's driving me crazy. I'm not expert, but this seems to be coded correctly. Here's the code: <div style="float: left; width:360px; height:467px;"><h2 style="text-align: center;">Top Stories: Le Progres</h2>[Wordpress shortcode for an advanced iFrame]</div><div style="float: right; width:517px; height:560px; margin-bottom: 2em;"><h2>Funny Helps Learning</h2>[Wordpress shortcode for an advanced iFrame}</div><div style="float: left; clear: both;"><h1 style="text-align: center; color: #0b00dd;">Learn French OnlineFree with Mots de L'actu</h1>TEXT</div> Can anyone help me. I'm green, but not too green. Barry
  3. Hadien, I think I've got it to work, and it's just what I wanted. Thanks so much for sticking with me. I know I'm way over my head and probably shouldn't even be wasting this forum's time, but instead of telling me to go read a book, you helped me. Thanks again! Barry
  4. Sorry to ask for help then disappear. I appreciate your help. I put all of what I thought I understood of what you said into Dreamweaver and hit the "LIVE" button, but it didn't work. Can you check my code, below, and tell me what I've done wrong? <!DOCTYPE html><html><head><script src="http://ajax.googleap...1/jquery.min.js"></script><script>$(document).ready(function(){ $(".collapsible").click(function(){ var button = $(this); //goes to the buttons parent (the div) and // adds the hidden class if its not there // otherwise it removes the hidden class so // that the paragraph will reshow button.parent().toggle("hidden"); //if the paragraph is hidden, change button // text to "show". Otherwise paragraph is // visible, change button text to "hide" button.parent().hasClass("hidden") ?button.text("show") :button.text("hide"); });}); </script></head><style>.hidden>p {display:none;"} </style><body><div> <p> this is my english paragraph. blah blah blah </p> <button class="collapsible">hide</button></div><div> <p> this is my french paragraph. Aren't you impressed at how fluent I am? </p> <button class="collapsible">hide</button></div></body></html> I do know CSS, but I am not familiar with the .hidden>p {display: none;} notation you mention. Also, I want the initial state of each paragraph to be hidden. Thanks for being so patient. Barry
  5. Hello! I have posted about this topic on Stack Overflow, but the responses I get seem to be a tad above my head, and I think they get impatient with my rudimentary knowledge. I'd like to post my question here, as a student and see if I can get an answer: What I want is to toggel two different passages one in French and one in English from hidden to visible. Here's the blog entry I'm talking about; http://techno-french.com/learning-french-online-free/learn-french-with-mouse-trap-dictee I would like to separately hide or show either the French or the English passage. Here's what the suggesion was at Stack Overflow: <!DOCTYPE html><html><head><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script><script>$(document).ready(function(){$("#hide").click(function(){$("p").hide();});$("#show").click(function(){$("p").show();});});</script></head><body><p style="display:none">If you click on the "Hide" button, I will disappear.</p><button id="hide">Hide</button><button id="show">Show</button></body></html> But this either hides or shows BOTH passages. How can I toggle them on or off INDEPENDENTLY? Any help would be appreciated. Barry
×
×
  • Create New...