trying to get an adobe edge responsive design that works…little help

[drotar]

I have been trying to add an edge animation to my responsive site with no luck. does anybody have any idea how to go about doing this? i’ve already tried the
width=”100%” height=”100% and also made the edge itself responsive by using %

i can get the width to work but the height doesn’t, also i am getting those unwanted scrollbars

any ideas would be greatly appreciated…

please feel free to email me at: [email protected]

the test site i am working on is http://www.johnbehring.tv/test/

[Paulie_D]

Remove the `padding-top` from the body **and** the `bottom:2px` from the footer.

Scrollbar disappeared when I did that on my laptop.

[ElijahFowler]

Remove both of the width=”100%” and height=”100%” on the Edge object, then place a class on it (class=”your_class_here”) and then place this style in your stylesheet:

.your_class_here {
min-height: 320px;
min-width: 360px;
vertical-align: middle;
}

That should get you going in the right direction.
Hope it helps.

-Elijah

[drotar]

thanks paulie_d for the scroll but still trying to figure out the edge

[drotar]

elijahF,
thanks for the excellent try but no go. i have been wrestling with this for two days. Arhhhgggghhhhhh!

d

[drotar]

this is the answer:

markup :

content

css:

.obj-wrapper {
position:relative;
width:50%;
padding-bottom:40%;
height:0;
overflow:hidden;
}
.content {
position:absolute;
width:100%;
height:100%;
background:red;
}

[drotar]

even better, the link to fixing it. http://stackoverflow.com/questions/9432029/setting-element-height-in-responsive-layout

thanks again, P, for the advice on getting rid of the scrollbars.

[ElijahFowler]

Well, that won’t take into account of the element’s ratio, but if it’s working like you need it to then by all means use it.

Glad you got it working.

-Elijah

[Author]

Posts