How to align contents of a WidgetZone?

Topics: ASP.NET 2.0, Controls
Jan 26, 2011 at 4:03 PM

I put some widget zones in my master page, using code like this:

                        <%--Search Box--%>
                        <div class="block">
                            <h2>Search</h2>
                                <blog:WidgetZone ZoneName="Zone1" runat="server"></blog:WidgetZone>
                        </div>

 

But here is how it appears:

 

http://i55.tinypic.com/evdic7.jpg

 

Here is what i used in my css:

 

/* widgetZone */
widgetzone {margin: auto;padding: 0;display: block;}

 

Here is the code as it appears to the client:

 

  <div class="block">
<h2>Search</h2>
 
<div id="widgetzone_Zone1" class="widgetzone">
<div class="widget search" id="widget1a9335d4-bd81-4b1c-885b-e549c4c9365b">
<br />
 
<div class="content">
<div id="searchbox">
<label for="searchfield" style="display:none">Search</label><input type=
"text" value="Enter search term" id="searchfield" onkeypress=
"if(event.keyCode==13) return BlogEngine.search('/BlogEngine.NET/')" onfocus=
"BlogEngine.searchClear('Enter search term')" onblur=
"BlogEngine.searchClear('Enter search term')" /><input type="button" value=
"Search" id="searchbutton" onclick="BlogEngine.search('/BlogEngine.NET/');"
onkeypress="BlogEngine.search('/BlogEngine.NET/');" /><br />
<input type="checkbox" id="searchcomments" /><label for="searchcomments">Also
search in comments?</label>
</div>
</div>
</div>
</div>
</div>

Anyone can tell me what i did wrong please?

Thanks
Jan 26, 2011 at 8:26 PM

Bump

Coordinator
Jan 27, 2011 at 9:26 AM

I'm looking at the screenshot, and it does look a little strange, but at least for me, I cannot give any advice without actually seeing the page live.  Meaning, seeing it run in my browser and looking at all of the surrounding HTML and CSS.  It's near impossible to give any advice with what you've provided.

So if you have a live URL, that would be ideal.

If you don't yet have Firebug, I would definitely recommend getting it and getting familiar with it.  It's a Firefox plug-in is priceless for solving layout issues, debugging JavaScript, monitoring HTTP traffic, etc.

Jan 28, 2011 at 8:21 PM
BenAmada wrote:

I'm looking at the screenshot, and it does look a little strange, but at least for me, I cannot give any advice without actually seeing the page live.  Meaning, seeing it run in my browser and looking at all of the surrounding HTML and CSS.  It's near impossible to give any advice with what you've provided.

So if you have a live URL, that would be ideal.

If you don't yet have Firebug, I would definitely recommend getting it and getting familiar with it.  It's a Firefox plug-in is priceless for solving layout issues, debugging JavaScript, monitoring HTTP traffic, etc.

 

Man that tool is so usefull.. i wish i had known about it before!

 

I figured it out. It seems the class the widget use is called content, which is already predefined and used in the css. Changed it and it works like a charm now :)

 

Thanks dude!