deviant art

Deviant Login
Buy ArtBuy T-Shirts & Gear Buy adCast Buy Premium Membership
Shop		  Join deviantART for FREE Take the Tour
:iconecssited:

#eCSSited

a place for all your CSS needs
View Badges!
+Watch
HomeAbout UsGalleryFavouritesJournal
Group Info Super Group Founded 5 Years ago Statistics 1,223 Members
98,075 Pageviews2,112 Watchers
Join our Group Send a Note

Who we are

:bulletorange: :bulletyellow: Who we are:



#eCSSited is a group to help you learning or improving CSS skills. People from the community who are willing to help, offer their knowledge to be shared and their time to teach you how to deal with classes, properties and values.

The focus of the group is to collect resources like tutorials, code snippets or graphical resources. But we also promote everything that is related to CSS, be it contests, news, projects or anything similar.

:bulletyellow: :bulletorange: :bulletyellow:

No journal/gallery designs, no finished journal/gallery skins, no webdesigns or anything else like that will be accepted for our gallery.

:bulletyellow: :bulletorange: :bulletyellow:


Before you decide if you want to become part of the group, make sure that you read through these guidelines and rules:

:bulletyellow: Reasons to join and not to join
For those who are unsure if they should join or not, please read this. It might helps you to understand the groups purpose a bit more.

:bulletyellow: F.A.Q.
A collection of the most important questions that might come up when you are new to this group or want to become a member. If something is still unclear please leave a comment on that blog or contact us directly.

:bulletyellow: Member Classes
A short overview of the member classes of the group.

:bulletorange: :bulletyellow: :bulletorange:

This is a free time project and we would encourage 'global' learning through the forum (you can only see that as an eCSSited Groupie or Resource Provider). But you can also leave comments on our profile to ask for help!

:bulletorange: :bulletyellow: :bulletorange:

Welcome + Overview 'Birthday Party'

Fri May 17, 2013, 12:15 AM
Skin Provider | CSS Help | Contests around dA


Hey everyone!
Today starts the party and we have prepared a few things for you. Below is a time schedule for you to see what you can expect and what you might want to join. There had been some more ideas, but time was too short to add that to the schedule so maybe there will be more smaller events in the future for you to take part.

For now we hope that you enjoy what we have prepared! Stay eCSSited! :heart:



:bulletorange: Friday 17th May


- Welcome + Overview by `ginkgografix
- Stamp Contest Announcement by `ginkgografix  -> [link]
- Feature "Groups" by `ginkgografix  -> [link]
- Feature "Light Journal/Gallery skins" by ^ladygagz -> [link]


:bulletorange: Saturday 18th May


- Interview "User Styles" by `ginkgografix  -> [link]
- "History of #eCSSited"- Trivia  (The winner of a 3 Months PM is =magicwingsforever)
- Feature 'User Styles' by `ginkgografix -> [link]


:bulletorange: Sunday 19th May


- Interview "Journal/Gallery CSS" by `ginkgografix  -> [link]
- Feature 'Journal/Gallery DDs' by `ginkgografix  -> [link] [link]
- Feature by ^ladygagz


:bulletorange: Monday 20th May


- Interview with `CypherVisor by ^ladygagz
- 'History of dA CSS' by `ginkgografix / ^VSConcepts
- Feature 'Custom Widgets' by `ginkgografix -> [link]



24 Comments
Welcome + Overview 'Birthday Party' May 17 24 Comments 5 Favourites

CSS Did You Know? - May 9th, 2013

Thu May 9, 2013, 5:28 PM
#CSS-DYK
AboutPast ArticlesCommunity Relations

{

CSS Did You Know?

}


Volume 10


:iconcss-dyk:

Welcome

CSS can be difficult when you're unfamiliar to it. So that's why we're writing these articles! If you have any suggestions or would like to write a section in future CSS Did You Know? articles, please note #CSS-DYK. :)

Inside

Author Avatar by `im-not-sana
Utilizing the Header and Footer Sections by `GillianIvy


:iconim-not-sana:

Author Avatar



Hey again Devious CSSkinners! So last article I mentioned how to add and style the .author{} selector. This article, I'll tell you how you can add an author's avatar into your journals that the gruze skin will automatically generate! Initially, I was going for a more difficult approach (which is why I separated the two articles) but I figured out a MUCH simpler way to code in the avatars! :eager:

CSS


.gr-top .author{}

.gr-top .author .avatar {
display: inline!important;
}


Basically, dA has set the .avatar{} display value to none, so we need to override that. After you've done that, you'll notice the avatar is at its original size and cropped off to the side. So you'll need to change it's position, width & height.

EXAMPLE


.gr-top .author{}

.gr-top .author .avatar {
display: inline!important;
width: 25px;
height: 25px;
top: 20px;
left: 48px;
}


RESULT




Quick Tip by `miontre: if you add position: static; the avatar will revert to its original position, next to the username!

That's just the most basic styling I've done to accommodate my own journal skin, now you can get creative with whatever property and values you like to match your CSS! If anyone has made any skins using the .author{} and .avatar{} selectors, link theme here! I'd like to see what you've all come up with :) Happy coding! :la:


:icongillianivy:

Utilizing Header and Footer Sections



If you have content you wish to have saved on your skin for every journal post, the best place to save it is in the Header and Footer sections. Typically a good place for links, menus, credits.... But can also be used to make a separate container.

Header by `GillianIvy Footer by `GillianIvy

Whatever by `GillianIvy End by `GillianIvy

Example by `GillianIvy


It can have whatever you want, text, links, images.  This might be a good spot for an image you want to easily be able to edit.  Instead of putting in the code.  Which would be easier for the user as well.  That way they can customize the skin with out needing to dig through the CSS.

With Preview by `GillianIvy


Say you would like to have the text area a different color than your header and your footer, but .text controls all three.  So you make a custom box to go inside your journal input.  Which resolves the issue.  However, you don't want people to forget these in their journal and have the section messed up.  So, open the tag in the header...  Then close the tag in your footer.  And Save.  Now, it is saved into the skin for each use.  No extra code for the user to have to remember.

Text Container by `GillianIvy


CSS Tips

Do note that because of the line breaks between the header/footer and the journal input area that it looks like you have extra padding.  Just remove it, in this case, padding:0 20px;
<p>Paragraphp> will not work well for this.
Blanks or blueprints of code HTML can be stored here for easy cut & paste, however many people will forget to edit it out and will have a random snippet on their journal instead.


28 Comments
CSS Did You Know? - May 9th, 2013 May 9 28 Comments 87 Favourites

Deviants

#Support eCSSited

:bulletyellow: :bulletorange: :bulletyellow:

Think that this group is worth to be supported? Feel free to donate some points to

:iconc2s2-support:

Points will be used to keep the SuperGroup status or to host contest and other fun events.

:bulletyellow: :bulletorange: :bulletyellow:

Thank you :heart:

#eCSSited - chat with us!




Every now and then we are hosting chat events every. They will all be announced through the group before.
You also could meet other fellow CSS coders to talk about group-related or general things there.

Helping Corner

Wed Jan 12, 2011, 8:29 AM by `ginkgografix:iconginkgografix:
Skin Provider | CSS Help | Contests around dA


This blog will now be used for deviants that need help with CSS related things. That could mean they are searching for a coder or someone who is willing to make a CSS for free.
If you are aware of such people send a note and their issue gets a spot here!

:pointr: If you are looking for general feedback or critques, please go here: [link]


- - -


~FishyFeeshy would like some help with certains journal features. For more details contact him directly.

[May 5th]





:bulletorange: no one is searching for help currently!
Keep us informed if you know someone having trouble with CSS etc.
[...]


170 Comments
Helping Corner January 12, 2011 170 Comments 15 Favourites

CSS Contests

Tue May 17, 2011, 6:09 AM by `ginkgografix:iconginkgografix:
Skin Provider | CSS Help | Contests around dA


Below you will find contest that are purely CSS related or accept CSS entries among others. Name, the deadline as well as a link to more details will be added if those information are available.
We are not responsible if dates, prizes or anything like that changes or a contest gets canceled. In case you get aware of such changes that should be mentioned here, it would be nice if you notify us about it.

If you know any contests or want us to promote yours, just let us know. Either via note or comment directly on this journal.


- - -

Contest:    SuicideGirls CSS contest by #SuicideGirls
Details: [link]
Deadline: 11:59 PST Friday 31st May





Contest:   PE: Thumbs Snippet Contest by `GillianIvy/#projecteducate  
Details: [link]
Deadline: May 30th 2013


  


94 Comments
CSS Contests May 17, 2011 94 Comments 8 Favourites

Feedback Area

Wed Feb 6, 2013, 3:46 AM by `ginkgografix:iconginkgografix:
Skin Provider | CSS Help | Contests around dA


This blog will be used for deviants that are looking for feedback and improvement regarding their dA skins. For more details look at the different categories below.
I will try to get back to as many as possible, but everyone is welcome to take a look at the deviations and help a fellow CSS coder/designer out.


---


Critique / General Feedback


You have finished a skin, are still fiddling around with a design or your code and what some feedback of how to improve?
Leave a comment below where you mention what kind of feedback you are looking for and for what skin/WIP. Please only add one deviation/link per comment. Once that deviation has been chosen the comment will be hidden to keep track of what has been already picked and what not.

Picked deviations will be available for at least 2 weeks until new deviations will be chosen again.


:bulletorange: `im-not-sana is looking for some feedback:
"Hey guys!

I'd really like some feedback on my skin for my articles [link] I feel like it doesn't look quite right but I dont know exactly how I can improve it since I suck at designing... Does it have too many images? Are the fonts readable and suit the skin if not then which font would be recommended? And just what looks out of place or needs to be changed for the design to look more appealing.

Thanks I appreciate it :) I'll leave a critique on one of your skins if you want as well!"
[March 9th]





Before:After - Code *


Those that want to improve their code and would like to see an "optimized" version of it should also leave a comment with a link to the deviation they would like to see a before:after version of.
In case you want improved versions of exclusive or personal skins make sure that you do not send your code to the group. Instead just leave a comment mentioning that you have such a skin and once i get back to you, send me the code via note or mail. I will not use it in any way other than doing this code check.

To help others to improve indirectly the before:after code will be uploaded as an image side by side (so that the difference is visible) to the gallery of #eCSSited only.
In case of personal/exclusive skins only examples of the before:after will be uploaded to prevent someone else using the code without permission.

Free skins will be listed below and can be checked by everyone who is interested as well.
I will pick skins as i have time to look at them, so there is no guarantees that your skin will be picked immediately. Will try to get back to everyone sooner or later though.


:bulletorange: no one is searching for code check atm
[February 6th]




* keep in mind that these before:after versions always will depend on who is looking at your code. If two different people would do it for you, you could get two different results as this always depends on the skill level as well as the way that certain person learned/improved.


23 Comments
Feedback Area February 6 23 Comments 3 Favourites

Out of curiosity: should the group accept journal/gallery skins and designs? 

66%
40 deviants said Yes, but only if they are free to use (aka for download or install), No personal stuff.
15%
9 deviants said No, the group should stay 'resources only'.
11%
7 deviants said Yes, everything. The more, the better!
8%
5 deviants said I am not sure about this or don't care.
8 comments Previous Polls

Affiliates

:iconjournalskin::icondeviantcss::iconcss-hunks::iconmastercss::icondeviantart-related::iconcss-babes::iconjournalcss::iconiterators::iconsolutionssanctuary::iconcss-dyk::icongroup-eaze::icon1337-code-junkies:

Visitors

You're not here because you're not logged in

Comments


Add a Comment:
 
Preview   Add Comment
:iconnikkittie:
=nikkittie May 14, 2013
Could anyone help me at all?

I made a skin and it was all fine and well, but in firefox the title is showing grey when it should be a dark red. I've tried color: inherit, and just changing the colours so they're all the same (link, hover, etc) but it's still showing grey here like this. [link]

It shows as red in my stash [link], it's just the persons page it's on where it's grey and I just can't figure out what's wrong. >:
Reply
(2 Replies)
:iconakio-stock:
=akio-stock May 12, 2013  Hobbyist Photographer
Is there any way of using 'fancy' fonts in dA Journal Skins? I used Google Fonts before, but I'm not sure how to add it to the journal CSS.
Reply
(1 Reply)
:iconchampionx91:
*Championx91 Apr 29, 2013  Professional Digital Artist
is there any codes or tutorial about custommade you dA portfolio ?
Reply
(1 Reply)
:iconscintillant-h:
*Scintillant-H Apr 26, 2013   General Artist
is it possible to have skins or other customizable options for the fave gallery or the "about us" section of supergroups? (I'm assuming "no", but it doesn't hurt to ask)
Reply
(1 Reply)
:iconpamelabydesign:
Mood: Love =pamelabydesign Mar 24, 2013  Professional Interface Designer
thank you, this is great and easy to follow.
Reply
Add a Comment:
 
Preview   Add Comment