.png)
The DIV macro inserts empty P tags which are breaking my layout! Is there any way to correct this?
I've created my theme layout w/in Manage Builder Layouts. My issue is with implementing my Header code under the Layout tab. I initially created the Home layout for my space using Dreamweaver so I could get all the CSS correct. I've put all of my custom css under the CSS tab Custom CSS. And I've tried implementing my HTML code using the HTML macro and straight-forward HTML code, using DIV macros with all ATB and Confluence macros and notation, and even a combination thereof with NO success!!
I'm losing my mind! Can anyone please help!??
Here's my HTML code that I initially wrote in Dreamweaver...
<div class="hdrlayout"> <div class="hdrlayouttr"> <div class="col col1"> <div class="hdrnhinlogo"><img src="images/nhin_hdrNHINLogo.jpg" width="98" height="59" alt="NHIN Logo" /></div> <div><img src="images/nhin_hdrRedLineLt.jpg" width="98" height="8" /></div> </div> <div class="col col2"> <div class="hdrnhinname"><img src="images/nhin_hdrNHINName.jpg" width="575" height="59" alt="Welcome to the Nationwide Health Information Network" /></div> <div><img src="images/nhin_hdrRedLineRt.jpg" width="673" height="8" /></div> </div> <div class="col col3"> <div class="utilitylinks"><a href="" class="username">Username</a><a href="">Log Out</a> <a href="">Contact Us</a></div> <div class="hdrnhinsearch"><form action="" method="get" name="search"><input name="searchfield" type="text" size="16" /> <input name="submit" type="button" value="Search" /></form></div> </div> </div> </div> <div class="hdrnav1"> <div><img src="images/nhin_nav1Overlay.jpg" width="98" height="31" /></div> <div class="hdrnav1menu">INSERT ATB MENUBAR MACRO HERE FOR MAIN NAVIGATION</div> </div>
As you can see I have multiple embedded DIV tags. In the CSS most of the DIVs are set to display as table, table-row, and table-cell. Everything should be nice and tight with no spacing between columns, rows, or other divs.
Here's my initial HTML code converted to all macros...
{div:class=hdrlayout}
{div2:class=hdrlayouttr}
{div3:class=col col1}
{div:class=hdrnhinlogo4}{menulink:home|space=nhin|icon=noicon}{builder-logo}{menulink}{div4}
{div4}!nhin:NHIN Images^nhin_hdrRedLineLt.jpg!{div4}
{div3}
{div3:class=col col2}
{div4:class=hdrnhinname}{menulink:home|space=nhin|icon=noicon}!nhin:NHIN Images^nhin_hdrNHINName.jpg|alt="Welcome to the Nationwide Health Information Network"!{menulink}{div4}
{div4}!nhin:NHIN Images^nhin_hdrRedLineRt.jpg!{div4}
{div3}
{div3:class=col col3}
{div4:class=utilitylinks}
{builder-hide:action=login,logout}{builder-show:user=@anonymous}{compound-menuitem:login|flat=true|hideanon=false|caption=Log In}{builder-show}{builder-hide2:user=@anonymous}{compound-menuitem:profile|flat=true|caption=%fullname%|class=welcomename} {compound-menuitem:logout|flat=true|hideanon=true|caption=Log Out} {builder-hide2}{compound-menuitem:space=nhin|page=Contact the NHIN Team|flat=true|caption=Contact Us}{div4}
{div4:class=hdrnhinsearch}{search-box}{div4}
{div3}
{div2}
{div}
{div:class=hdrnav1}
{div2}!nhin:NHIN Images^nhin_nav1Overlay.jpg!{div2}
{div2:class=hdrnav1menu}
{builder-hide:action=login,logout}
{menubar:id=nav1|class=nav1|tooltips=false}
{compound-menuitem:home|space=nhin|caption=Home}
{menu}[nhin:What is the NHIN?]
{menuitem}[nhin:Benefits of the NHIN]{menuitem}
{menuitem}[nhin:Case Studies]{menuitem}
{menuitem}[nhin:FAQ]{menuitem}
{menuitem}[nhin:Security & Privacy]{menuitem}
{menu}
{menu}[nhin:Getting Started]
{menuitem}[nhin:Future Vision]{menuitem}
{menuitem}[nhin:NHIN Limited Production Exchange]{menuitem}
{menu}
{menu}[nhin:Resources]
{menuitem}[nhin:Business Resources]{menuitem}
{menuitem}[nhin:Technical Resources]{menuitem}
{menu}
{menu}[nhin:News & Events]
{menuitem}[nhin:Media Resources]{menuitem}
{menuitem}[nhin:NHIN Announcements]{menuitem}
{menuitem}[nhin:NHIN Events]{menuitem}
{menuitem}[nhin:Related News & Links]{menuitem}
{menu}
{menu}[nhin:CONNECT]
{menuitem}[nhin:CONNECT FAQ]{menuitem}
{menuitem}[nhin:Role in the NHIN]{menuitem}
{menu}
{menubar}
{builder-hide}
{div2}
{div}
And here's what Confluence generates from it... Check out the 5th line of code with the empty P tag! And why is my logo on the 7th code line pulled outside of it's DIV on the 6th line?? And why is my image on the 9th line wrapped inside a P and SPAN tag??? What gives with generating crappy code??? UGH!
<td id="atb-header" class="layout atb-header"><div id="atb-headerdiv" class="layout atb-headerdiv">
<div class="hdrlayout">
<div class="hdrlayouttr">
<div class="col col1">
<p> </p>
<div class="hdrnhinlogo4"></div>
<a href="/display/nhin" rel=" home"><img border="0" title="Click this logo to return to the home page" class="builder-logo global-logo" src="/download/attachments/425986/global.logo?version=2&modificationDate=1268943604411" alt="global logo"/></a>
<div></div>
<p><span class="image-wrap" style=""><img src="/download/attachments/1212420/nhin_hdrRedLineLt.jpg?version=1&modificationDate=1268943790129" border="0" /></span></p>
<div></div>
</div>
<div class="col col2">
<div class="hdrnhinname"><a href="/display/nhin" rel=" home"><span class="image-wrap" style=""><img src="/download/attachments/1212420/nhin_hdrNHINName.jpg?version=1&modificationDate=1268943790113" alt="Welcome to the Nationwide Health Information Network" border="0" /></span></a></div>
<div><span class="image-wrap" style=""><img src="/download/attachments/1212420/nhin_hdrRedLineRt.jpg?version=1&modificationDate=1268943790129" border="0" /></span></div>
</div>
<div class="col col3">
<div class="utilitylinks"> <a href="/users/viewuserprofile.action?username=mcwood9" class="welcomename" rel="">Melissa C. Wood</a> <a href="/logout.action" rel="nofollow">Log Out</a> <a href="/display/nhin/Contact+the+NHIN+Team" rel="">Contact Us</a></div>
<div class="hdrnhinsearch">
<form method="get" class="confluence-searchbox adaptavist-searchbox marginlessForm " action="/dosearchsite.action">
<input type="hidden" name="key" value="nhin" />
<input type="text" class="search-query searchQuery" name="searchQuery.queryString" id="searchQuery.queryString" />
<input type="hidden" name="searchQuery.spaceKey" value="nhin" />
<input type="submit" class="search-button searchButton" value="Search" />
</form>
</div>
</div>
</div>
</div>
<div class="hdrnav1">
<div><span class="image-wrap" style=""><img src="/download/attachments/1212420/nhin_nav1Overlay.jpg?version=1&modificationDate=1268943957860" border="0" /></span></div>
<div class="hdrnav1menu">
<div id="menunav1" class="menubar menubarnav1 nav1">
<ul id="menunav1-data" class="menulist">
<li class="menuitem "><a href="/display/nhin" rel=" home">Home</a></li>
<li class="menuitem "><a href="/pages/viewpage.action?pageId=720902" title="What is the NHIN?">What is the NHIN?</a>
<ul class="submenu ">
<li class="menuitem "><a href="/display/nhin/Benefits+of+the+NHIN" title="Benefits of the NHIN">Benefits of the NHIN</a></li>
<li class="menuitem "><a href="/display/nhin/Case+Studies" title="Case Studies">Case Studies</a></li>
<li class="menuitem "><a href="/display/nhin/FAQ" title="FAQ">FAQ</a></li>
<li class="menuitem "><a href="/pages/viewpage.action?pageId=1605657" title="Security & Privacy">Security & Privacy</a></li>
</ul>
</li>
<li class="menuitem "><a href="/display/nhin/Getting+Started" title="Getting Started">Getting Started</a>
<ul class="submenu ">
<li class="menuitem "><a href="/display/nhin/Future+Vision" title="Future Vision">Future Vision</a></li>
<li class="menuitem "><a href="/display/nhin/NHIN+Limited+Production+Exchange" title="NHIN Limited Production Exchange">NHIN Limited Production Exchange</a></li>
</ul>
</li>
<li class="menuitem "><a href="/display/nhin/Resources" title="Resources">Resources</a>
<ul class="submenu ">
<li class="menuitem "><a href="/display/nhin/Business+Resources" title="Business Resources">Business Resources</a></li>
<li class="menuitem "><a href="/display/nhin/Technical+Resources" title="Technical Resources">Technical Resources</a></li>
</ul>
</li>
<li class="menuitem "><a href="/pages/viewpage.action?pageId=720916" title="News & Events">News & Events</a>
<ul class="submenu ">
<li class="menuitem "><a href="/display/nhin/Media+Resources" title="Media Resources">Media Resources</a></li>
<li class="menuitem "><a href="/display/nhin/NHIN+Announcements" title="NHIN Announcements">NHIN Announcements</a></li>
<li class="menuitem "><a href="/display/nhin/NHIN+Events" title="NHIN Events">NHIN Events</a></li>
<li class="menuitem "><a href="/pages/viewpage.action?pageId=720897" title="Related News & Links">Related News & Links</a></li>
</ul>
</li>
<li class="menuitem "><a href="/display/nhin/CONNECT" title="CONNECT">CONNECT</a>
<ul class="submenu ">
<li class="menuitem "><a href="/display/nhin/CONNECT+FAQ" title="CONNECT FAQ">CONNECT FAQ</a></li>
<li class="menuitem "><a href="/display/nhin/Role+in+the+NHIN" title="Role in the NHIN">Role in the NHIN</a></li>
</ul>
</li>
</ul>
</div>
<script type="text/javascript" language="JavaScript">
function initmenu_nav1() {
if (window.DynarchMenu) {
var menuOpts={electric:250, tooltips:false, shadows:[4,6], smoothShadows:true, blink:false, lazy:false, setFocus:false, scrolling:true};
if (document.browserInfo.isOpera) menuOpts["scrolling"]=false;
document.getElementById("menunav1-data").className="";
DynarchMenu.setup("menunav1-data", menuOpts);
}
}
if (document.browserInfo.isIE) {
window.attachEvent("onload", initmenu_nav1);
} else {
BuilderEvents.addDefermentListener("header",initmenu_nav1,"initmenu_nav1");
}
</script>
</div>
</div>
</div></td>
Comments (4)
Mar 18, 2010
Steeve Cayla says:
Line 4, you are opening a {div} instead of a {div4}. This should solve the logo ...Line 4, you are opening a {div} instead of a {div4}. This should solve the logo problem I guess.
Cheers
Mar 18, 2010
Melissa C. Wood says:
Thanks for catching that! But unfortunately it didn't change anything.Thanks for catching that! But unfortunately it didn't change anything.
Mar 18, 2010
Steeve Cayla says:
Well then, line 13 your {builder-hide} is never closed Also, the {compound-menu...Well then, line 13 your {builder-hide} is never closed
Also, the {compound-menuitem:logout} macro doesn't display the logout link if you are not logged in, and vice-versa with the login link. You can put these macros one after another, this will save you from playing with too many {builder-show/hide} macros.
Mar 19, 2010
Alain Moran says:
The <p> tags are generated by confluence 3.0's renderer ... I wont go into...The <p> tags are generated by confluence 3.0's renderer ... I wont go into what happened in that version (unless you are actually interested in the internals of the confluence renderer) however your solution is to upgrade to confluence 3.1 or later.