PDA

View Full Version : Hello, the dynamic content script



alwaysme
02-01-2009, 08:08 AM
1) Script Title: Dynamic Content

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/dddropdownpanel.htm

3) Describe problem: I love this place, thanks to the founder and contributors. The issue is that this spans accross the whole page, my website is centered with a width of 750.....where do i control this width instead of having it accross the whole page?

THank you
regards

Snookerman
02-01-2009, 08:17 AM
Add this to your css code:

I see I missed the toggle button before, use this new code instead, credits to John, thanks.


#mypanel {
width: 750px;
margin: 0 auto;
}

Good luck!

alwaysme
02-01-2009, 09:32 AM
Thanks for your speedy response,

but are you sure that is the name i need to add "mypanelcontent"


this is the css, its kinda confusing to where i should add that part


.ddpanel .ddpanelcontent{ /*CSS for "content" DIV of Drop Down Panel*/
color: white;
background: black; /*background of Drop Down Panel*/
/*Do NOT add any "padding" or "margin" properties here! Any padding/margin should be added to your content's container within this DIV instead */
}

.ddpanel .ddpaneltab{ /*CSS for "toggle" tab DIV of Drop Down Panel*/
margin-right: 20px;
font: normal 12px Arial;
}

.ddpanel .ddpaneltab a{ /*"toggle" tab related CSS*/
float: right;
color: white;
background: black url(toggleleft.gif) no-repeat left bottom; /*background of toggle tab*/
text-decoration: none;
letter-spacing: 1px;
}

.ddpanel .ddpaneltab a span{ /*"toggle" tab related CSS*/
float: left;
display: block;
background: transparent url(toggleright.gif) no-repeat right bottom;
padding: 1px 12px 4px 13px;
cursor: pointer;
}

.ddpanel .ddpaneltab a span img.pointerimage{ /*CSS for pointer image within toggle tab*/
margin-top: 2px;
margin-left: 5px;
}

.ddpanel .ddpaneltab a:hover{ /*"toggle" tab related CSS*/
background-color: navy; /*background of toggle tab onMouseover*/
}

.ddpanel .ddpaneltab a:active, .ddpanel .ddpaneltab a:focus{ /*"toggle" tab related CSS*/
outline: 0;
}



.ddpanel .ddpaneltab a:hover span{ /*"toggle" tab related CSS*/
background-color: transparent;
}

Thank you and hope you are not offended by my amatuer request

Snookerman
02-01-2009, 11:51 AM
Oh, I realize I was a bit unclear since I highlighted only a part of the code. Just copy the entire piece of code and add it to your css code.

Good luck!

jscheuer1
02-01-2009, 02:36 PM
If you want the toggle button to also move in, use:


#mypanel {
width: 750px;
margin: 0 auto;
}

instead.

Also, by way of further explanation, this assumes a DD Drop Down Panel setup using the mypanel id as shown on the demo page for this script.

alwaysme
02-02-2009, 05:52 AM
hello there,

i tried it and it worked but it would not center

i am using this


#mypanel {
width: 750px;
margin: 0 auto;
align:center;
}


thanks

alwaysme
02-02-2009, 06:58 AM
Hello again,

There is no use, i tried everything but it would not center



#mypanel {


margin-left: auto;
margin-right: auto;
width: 760px;
}





I am using the exact demo on that page

jscheuer1
02-02-2009, 07:44 AM
If you are using IE, you will need a valid URL DOCTYPE like:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

for your page. There could be other issues. If you want more help:

Please post a link to the page on your site that contains the problematic code so we can check it out.