Hi everyone, I'm setting up a wordpress site, and have the current example based at http://k3.davidkeatscroft.com I'm having some issues with the paragraph of text below the slider on the main page. I had to use a "clear:both" command on the paragraph class to get it to stretch to its full width. It was getting forced to wrap around the contact form that is on the slider button directly under the slider. This works fine, although I've noticed that the clear:both command is now forcing a gap between the h2 text ("You're in expert hands") and the paragraph. I'm fairly sure it's related to the contact form, as when you toggle the slide down, you can see the gap disappears. Quite confusing as I'm still pretty new to css! Can someone possibly take a look and give me some idea on how to eliminate the space? If I remove the clear from the p.class then it gets rid of the gap, but then the forced text wrap makes it look a bit rubbish! Thanks guys. The code for the text widget (including the content toggle button, contact form, and h2 and paragph) is as follows: <div id="cont-toggle"> <div style="float:right;">[toggle_content title=""]<div style="width:600px;float:right;">[contact-form-7 id="36" title="Contact form 2"]</div> [/toggle_content]</div> </div> <h2 style="color:#00b259;font-weight:bold;margin-top:0;font-size:20px !important;">You're in expert hands</h2> <p id="maincopy">Here at K3 Managed Services, we create business computing solutions for a huge range of clients – probably including businesses like yours. From unleashing your business potential with cloud computing to hosting and managing your critical software products such as Sage, SYSPRO, SmartVision, Omnis, Dynamics AX, Dynamics NAV and Dynamics CRM, K3 Managed Services will give you the competitive edge.</p> Code (markup): and the code for the p.maincopy class is: #maincopy{ width:900px; clear:both; } Code (markup):
It is an issue with the button you are correct. The height is 30px and there is a padding-top 30px too that is pushing the text down under it. Removing the padding-top attribute from 'h4.slide_toggle a' works in Chrome.
You're an absolute legend sir, thanks a million - that's been bugging me all weekend, but sometimes you can't see the wood for the trees! I still consider myself pretty new to css, but I reckon I'll stick around and hopefully I can help someone out the same way you've helped me. Cheers