this is alot simpler then the css animation tips i posted recently..in fact this is a really simple one

just wanted to highlight the dates on the events to make them stand out a lil more

so just added a border, box  shadow (but inside, not outside the box) and some padding (oh yea and a lil corner rounding)

real  simple

really simple code but really makes the daytes stand out more i think

u can leave or remove the hover part if you want..just added that as i'm writing this

div.module_events div.xg_module_body div.wrap div.dategroup {border:thin solid #999; box-shadow:inset #CCC 10px 10px 13px; padding:10px 2px 4px 0; border-radius:8px 2px 2px 6px; }
div.module_events div.xg_module_body div.wrap div.dategroup:hover {box-shadow:#CCC 4px 4px 4px;}

Views: 347

Reply to This

Replies to This Discussion

hmm thats very odd i will have to look at that

i did some module rounding  on 2 corners anyway i had to do 1 corner on the head w=er 1 on footer

if u explain exactly what u want i can figure it out but is thecode active on your site ill take a look

It actually does highlight the event date Im sorry pal! I had to view it in mozilla or chrome...IE sucks ass lol thanks my man! and please get back to me regarding rounding the module corners of my site...I hate the default look lol the edges are sharper enough to cut something lol so id like to round em out! Thanks again Eagle..

ok played with your ci=ode  and came up with 2 versions

div.xg_module_head h2 {padding:10px;}

div.xg_module_head h2 {padding-left:15px;}

try both see which u like

cant see events without joining

oops my memory must suck haha (tryu=ing to write code by what i think is there instead of looking to se whats actualy there) change the h3 to h2

to round out the modules was kinda not perfect the way i did it however it looked ok so i left it

i only rounded 2 of the 4 corners  and therfore i had to di o 1 cornrr of the footer 1 of the header

i also slightly enlarged the no title header like u got on the description module just to make it look better

this includes everything the music player too

div.xg_module {border-radius: 25px 0 25px 0;-moz-border-radius: 25px 0 25px 0;-webkit-border-radius: 25px 0 25px 0;}
div.xg_module_head {border-radius: 25px 0 0 0;-moz-border-radius: 25px 0 0 0;-webkit-border-radius: 25px 0 0 0;}
div.xg_module_foot {border-radius:0 0 25px 0;-moz-border-radius:0 0 25px 0;-webkit-border-radius:0 0 25px 0; padding:2px 25px;}
div.xg_user_generated, div.account-links, div.xj_sidebar_content div.xg_module div.xg_module_body, div.musicplayer_visible .xj_music_embed, div.xg_module_with_dialog {border-radius:0 0 25px 0;-moz-border-radius:0 0 25px 0;-webkit-border-radius:0 0 25px 0;}
div.xg_module_body {border-radius:25px 0 25px 0;-moz-border-radius:25px 0 25px 0;-webkit-border-radius:25px 0 25px 0;}
div.notitle {height:8px;}

u can try with and without the xg_module_body i think i added that cause the sharp corner stuck thru the rounded corner or womething

you are the man bro! lol the code worked only thing is now the text that are in the header of the modules look a little off....go to my site and see what I mean wellkunnected.com but it would be awesome if I could round all the corners, the look you created is awesome but I want all the edges round if you can do it...i'll use it! lol lets give it a whirl ;)

add

div.xg_module_head {padding-left:10px;}

to round other corners change the 0's to 25px's but not all because u dont want all the module head borders round only top 2

so  u see theres 4 sets of numbers thats top left top right  bottom right bottom left it goes clockwise from top left  so now u know which ones to change for which corners

yea its weird its just the placement of certain things ning has on the network thats throwing off how it looks when I rounded them but its pretty much exactly what I was looking for its just that I want to be able to round every corner but it looks as though the way ning has it set up if I do this its going to cut off some of the titles of the modules so I need you man! lol 

or now that i think about it u might need div.xg_module_head h3 instead

jut add the padding   i think this should do it

div.xg_module_head hs {padding-left:10px;}  try 14 if 10s not enough then adjust as needed

ok Eagle now im confused! lol I dont see H2 or H3 in any of the code...can you send me the code again i suppose with everything I need in it

RSS

Latest Activity

Mike Collins replied to Rafael's discussion 'Multiple Chat rooms for Ning 3.0'
"That's a shame. Understand about the video technology although the skype integration is an…"
39 minutes ago
Michael Goebel replied to Michael Goebel's discussion 'Where have the text boxes on the profile pages gone ?!?!'
"I also don't think Ning will take much notice... I have been asking them for YEARS to fix the…"
4 hours ago
Strumelia replied to Michael Goebel's discussion 'Where have the text boxes on the profile pages gone ?!?!'
"It becomes a very serious problem if, along with taking away members' music player, also the…"
4 hours ago

NC for Hire
JFarrow replied to Phil McCluskey's discussion 'Site Manager Updates for Ning 3.0 Networks'
"you guys are starting to impress me all over again!  thanks for the updates!"
5 hours ago
Melinda Orr replied to Michael Goebel's discussion 'Where have the text boxes on the profile pages gone ?!?!'
"Wishing for some response from Ning here... thanks Patrick for sharing these details :) "
6 hours ago
Melinda Orr replied to Michael Goebel's discussion 'Where have the text boxes on the profile pages gone ?!?!'
"I'm thinking bringing back the  RSS feed box would be a good thing as well. What's…"
6 hours ago
Melinda Orr replied to Michael Goebel's discussion 'Where have the text boxes on the profile pages gone ?!?!'
"Thanks Kos! "
6 hours ago
Kos replied to soaringeagle's discussion 'killer penguins'
"Here's the updated Keyword Tool link http://bit.ly/16hsT0x"
6 hours ago

© 2013   Created by Ning.

Badges  |  Report an Issue  |  Terms of Service