/    Sign up×
Community /Pin to ProfileBookmark

Drop shadows on a border…

Copy linkTweet thisAlerts:
Jan 13.2012

I’m looking to just add some drop shadows to the left side border and right side border of my content area.

is this possible?

to post a comment
CSS

10 Comments(s) ↴

Copy linkTweet thisAlerts:
@3NexJan 14.2012 — Only left and right, without top and bottom? I don't think that's possible with only drop shadow, but it could be faked with two divs instead of one.

Here's a complete guide to shadows, you have some examples near the middle of the document.

http://www.css3.info/preview/box-shadow/
Copy linkTweet thisAlerts:
@rtretheweyJan 14.2012 — You can use multiple settings in the box-shadow property:
<i>
</i>box-shadow:4px 0px 2px #666, -4px 0px 2px #666;
Copy linkTweet thisAlerts:
@SupplementauthorJan 14.2012 — You can use multiple settings in the box-shadow property:
<i>
</i>box-shadow:4px 0px 2px #666, -4px 0px 2px #666;
[/QUOTE]


still lightly shows a border on the top and bottom.

=/
Copy linkTweet thisAlerts:
@rtretheweyJan 14.2012 — Then there's something else going on. Post an example URL.
Copy linkTweet thisAlerts:
@SupplementauthorJan 14.2012 — ok, i'll post a picture in a second.. but it's around the box model... the center div.

it's still showing just a thin top and bottom section..

not left and right specifically, which is what is intended..

I'm starting to think there really is no way of doing it completely
Copy linkTweet thisAlerts:
@3NexJan 14.2012 — Then there's something else going on[/QUOTE]

Yes, it is. It's you not knowing what he means.
Copy linkTweet thisAlerts:
@SupplementauthorJan 14.2012 — Yes, it is. It's you not knowing what he means.[/QUOTE]

actually, i figured it out..

Greatly appreciated my friends!


=)
Copy linkTweet thisAlerts:
@SupplementauthorJan 16.2012 — So there is still a bit of a problem and you'll see the border on the bottom if you ctrl and make the page as small as can be...

http://greenfitco.com/tm/project.html

Additionally, you won't see the border on the bottom if you didn't ctrl and make super small... but is there a way to extend just all the way down without seeing that border no matter how small you make the page?

Thanks in advance guys!
Copy linkTweet thisAlerts:
@SupplementauthorJan 16.2012 — anybody see what i'm on about?
Copy linkTweet thisAlerts:
@rtretheweyJan 17.2012 — If you mean the way the center image of the gadgets bleeds through the right side of your shadowed container, then yes. It's the containing DIV. The class .grid2col sets the width to 100&#37;, but then it seems there's a padding or margin issue with the containing element - presumably a <div> - which bumps it to the right so it overflows. Try removing the .grid2col class and then deal with whatever is bumping things to the right.
×

Success!

Help @Supplement spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.15,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...