CSS Elements - Frigging Search Bar

[br0daR1DDICK]

Hey members of WJ.

I'm using a template on the blogger from PBTemplates. http://btemplates.com/2011/blogger-template-emboss/
I've expanded the width from the original 950px to 1000px. Problem is now the search bar is still where it is at the 950px position to the right. Everything esle has moved as it suppose to. Where I want the search bar is at 1000px to the right.
Does anyone understand these properties here? I think the answer of correcting it lies here;

/* Search ----------------------------------------------- */
#search{border:1px solid #393939;background:#2D2D2D;height:28px;padding:0;text-align:left;overflow:hidden}
#search #s{background:none;color:#949393;border:0;padding:4px;margin:2px 0 0 2px;float:left}
#search .search-image{border:0;vertical-align:top;float:right;margin:6px 4px 0 0px}
#search-wrap{width:300px;padding:15px 0}
.topsearch #search{margin:22px 0 0 0}

I've tried every combination, it barely budges. Anyone care to help?

Ta.

 

[deliteblogger]

i think this would work:

#search{border:1px solid #393939;background:#2D2D2D;height:28px;padding:0;text-align:left;overflow:hidden}
#search #s{background:none;color:#949393;border:0;padding: 4px;margin:2px 0 0 2px;float:left}
#search .search-image{border:0;vertical-align:top;float:right;margin:6px 4px 0 0px}
#search-wrap{width:300px;padding:15px 0}
.topsearch #search{margin:22px 0 0 0;position: relative; left: 50px;}

 

[Psycho]

have you tried this?

.topsearch#search {margin: 22px 0 0 50px;}

If you have a modified version of this template online, please give me a link. I can check it out with firebug.

 

[br0daR1DDICK]

Ah excellent, yep it works. Thanks.
Here's a link of a modified template. http://testingtemplates12345.blogspot.com/

As you can see, the only problems remaining is the secondary menu-rap and the footer which both remain at 950px position.

 

[Psycho]

.span-24, div.span-24 {width: 1000px; margin: 0;}

This will fix both of the issues you mentioned.

 

[br0daR1DDICK]

Thank bro. It works with the footer wrap, but I have absolutely no idea where to stick it with the menu wrap?

menu-secondary-wrap{padding:0;position:relative;height:40px;z-index:300;background:#EBEBE5;-moz-border-radius:5px;-khtml-border-radius:5px;-webkit-border-radius:5px;border-radius:5px}
.menu-secondary span-24, div.span-24 {width: 1000px; margin: 0;}
.menu-secondary ul{min-width:160px}
.menu-secondary li a{color:#5C544A;padding:14px 15px 11px 15px;text-decoration:none;text-transform:uppercase;font:bold 12px "Trebuchet MS", Helvetica, sans-serif}
.menu-secondary li a:hover,.menu-secondary li a:active,.menu-secondary li a:focus,.menu-secondary li:hover > a,.menu-secondary li.current-cat > a,.menu-secondary li.current_page_item > a,.menu-secondary li.current-menu-item > a{color:#FFF;background:#66177F;outline:0}
.menu-secondary li li a{color:#FFF;background:#880088;padding:10px 15px;text-transform:none;margin:0;font-weight:normal;text-shadow:none}
.menu-secondary li li a:hover,.menu-secondary li li a:active,.menu-secondary li li a:focus,.menu-secondary li li:hover > a,.menu-secondary li li.current-cat > a,.menu-secondary li li.current_page_item > a,.menu-secondary li li.current-menu-item > a{color:#FFF;background:#66177F;outline:0;text-shadow:none}
.menu-secondary a.sf-with-ul{padding-right:26px;min-width:1px}
.menu-secondary .sf-sub-indicator{position:absolute;display:block;overflow:hidden;right:0;top:0;padding:12px 13px 0 0}
.menu-secondary li li .sf-sub-indicator{padding:10px 13px 0 0}
.wrap-menu-secondary .sf-shadow ul{background:url('http://1.bp.blogspot.com/-8I0tsURxpeY/TjhSrzOxjaI/AAAAAAAAAX4/SPn8f_OB1z4/s000/menu-secondary-shadow.png') no-repeat bottom right}

 

[Psycho]

It should have fixed, can you update the online template so i can take a look?

 

[br0daR1DDICK]

Just updated it. I had to remove the content from the footer, so its looking bare right now.

 

[Psycho]

.span-24, div.span-24 {width: 1000px;margin: 0;}

This still appears to be 950px in updated version.

Try to search for "950" in the CSS file and change it to 1000.
That shall do it.

 

[br0daR1DDICK]

There it is. Phew. Thanks a lot, man.