Jump to content
Sign in to follow this  
scootdc

Styling sidebar with custom code

Recommended Posts

scootdc    0
scootdc

This is driving me crazy. Trying to drop the sidebar on this page (and others) and style the background image of the widgets.

http://royalpalmsmtpleasant.com/contact-us/

I've done this before on other sites but can't seen to figure this one out.

I'm using the following custom code...what am I missing?

body{}

#wp-admin-bar {display: none};

ul#list_sidebar_primary.sidebar_widgets li#text-2.widget_text {

background: url("http://barrysellscharleston.com/development3/wp-content/uploads/2012/09/bgr-box-trans.png") repeat-x scroll left top #123456;

border: 1px solid #754d45;

font-size: 14px;

margin: 0 0 10px 0;

padding: 5px;

}

#feature_slider div.default-features {width: 640px;}

#feature-area {width: 640px;}

#feature-footer {width: 640px;}

#feature_slider{width:640px;}

#sidebar-wrap{margin-top:-510px;}

.contact-us ul#list_sidebar_primary.sidebar_widgets{margin-top:500px;}

ul#list_sidebar_universal.sidebar_widgets{margin-top:365px;}

#feature-area, .feature-wrap {width: 640px;}

#feature-footer {width: 640px;}

#feature_slider .text-right .fcontent {

float: right;

width: 240px;

}

#feature_slider .text-left .fcontent {

float: left;

width: 240px;

}

#cred {display:none;}

Share this post


Link to post
Share on other sites
catrina    103
catrina

Try this code:

ul#list_sidebar_primary li#text-2 .widget_text {

background: url("[url="http://barrysellscharleston.com/development3/wp-content/uploads/2012/09/bgr-box-trans.png"]http://barrysellscha...-box-trans.png"[/url]) repeat-x scroll left top #123456;

	border: 1px solid #754d45;

	font-size: 14px;

	margin: 0 0 10px 0;

	padding: 5px;

}


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites
scootdc    0
scootdc

Not working. Here's the proper code again. Any ideas?

body{}

#wp-admin-bar {display: none};

ul#list_sidebar_primary li#text-2 .widget_text {

background: url("http://royalpalmsmtpleasant.com/wp-content/uploads/2012/09/bgr-box-trans.png") repeat-x scroll left top #123456;

border: 1px solid #000000;

font-size: 14px;

margin: 0 0 10px 0;

padding: 5px;

}

#feature_slider div.default-features {width: 640px;}

#feature-area {width: 640px;}

#feature-footer {width: 640px;}

#feature_slider{width:640px;}

#sidebar-wrap{margin-top:-510px;}

.contact-us ul#list_sidebar_primary li#text-2 .widget_text {margin-top:500px;}

ul#list_sidebar_universal.sidebar_widgets{margin-top:375px;}

#feature-area, .feature-wrap {width: 640px;}

#feature-footer {width: 640px;}

#feature_slider .text-right .fcontent {

float: right;

width: 240px;

}

#feature_slider .text-left .fcontent {

float: left;

width: 240px;

}

#cred {display:none;}

Share this post


Link to post
Share on other sites
James B    436
James B

Hi there,

You're trying to drop the sidebar, but it has a negative figure in it, which is making it go up the page not down.

Try this


#sidebar1 {

    margin-top: 500px;

    width: 320px;

}

and for the widgets try (replace white with your url etc)

.widget {

    background: none repeat scroll 0 0 white;

    margin-bottom: 1em;

    overflow: hidden;

}


Kindly search the forum and read the documentation before posting. It will help you resolve many issues.

For CSS help be sure to check out W3Schools first and be sure to download FireBug for FireFox for troubleshooting.

James B

Share this post


Link to post
Share on other sites
scootdc    0
scootdc

still not working. I'm trying to get one setting on the contact us page and one on the welcome page. here's the revised code...please help.

body{}

#wp-admin-bar {display: none};

ul#list_sidebar_primary li#text-2 .widget_text {

background: url("http://royalpalmsmtpleasant.com/wp-content/uploads/2012/09/bgr-box-trans.png") repeat-x scroll left top #123456;

border: 1px solid #000000;

font-size: 14px;

margin: 0 0 10px 0;

padding: 5px;

}

#sidebar1 {

margin-top: -500px;

width: 320px;

}

#feature_slider div.default-features {width: 640px;}

#feature-area {width: 640px;}

#feature-footer {width: 640px;}

#feature_slider{width:640px;}

.welcome #sidebar1 {margin-top:-500px;}

#feature-area, .feature-wrap {width: 640px;}

#feature-footer {width: 640px;}

#feature_slider .text-right .fcontent {

float: right;

width: 240px;

}

#feature_slider .text-left .fcontent {

float: left;

width: 240px;

}

#cred {display:none;}

Share this post


Link to post
Share on other sites
catrina    103
catrina

Replace this:

ul#list_sidebar_primary li#text-2 .widget_text
with this:
ul#list_sidebar_primary li#text-2 li.widget_text.widget.fix[/code]


Please read the docs before posting. Please do not private message me unless I ask you to.

Designer | Catrina Dulay

Founder | Catrina and Mouse

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×