homepage Welcome to WebmasterWorld Guest from 54.166.105.24
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
Is using minus bad practise?
Do negatives indicate poor code development
jelly46

5+ Year Member



 
Msg#: 4330418 posted 9:31 am on Jun 24, 2011 (gmt 0)

Hello all

Long time no speak.

Is it bad development to use minus in css {margin-top: -15px;}

I heard it was i just want confirmation if it is or not.

I am working on a high profile project and wanted input on this.

Can you help?

Thanks

J

 

alias

10+ Year Member



 
Msg#: 4330418 posted 10:05 am on Jun 24, 2011 (gmt 0)

While it is ok to have negative left/right margins to achieve certain visual effects, having negative top/bottom margins usually indicates something in the layout is being styled incorrectly.

You should instead aim and modify the vertical gaps in your layout by adjusting line heights and positive margins (and paddings if required) on the surrounding elements.

penders

WebmasterWorld Senior Member penders us a WebmasterWorld Top Contributor of All Time 5+ Year Member Top Contributors Of The Month



 
Msg#: 4330418 posted 10:18 am on Jun 24, 2011 (gmt 0)

Negative margins have been known to cause problems in IE7 and below with content being cut off. And, as alias suggests, it could also indicate a problem with the rest of the design. But I think it is wrong to say that negative margins are 'bad development' in all cases. But as always, test test test.

jelly46

5+ Year Member



 
Msg#: 4330418 posted 10:19 am on Jun 24, 2011 (gmt 0)

Hello alias

I have tried all i know and because its a CMS i am styling i dont have full autonomy.

Am i right in saying its no disaster?

Thank you so much

J

jelly46

5+ Year Member



 
Msg#: 4330418 posted 10:25 am on Jun 24, 2011 (gmt 0)

Nice one penders

alias

10+ Year Member



 
Msg#: 4330418 posted 10:28 am on Jun 24, 2011 (gmt 0)

It's no disaster, of course.

And making negative margins work in IE is super simple -- just add
zoom: 1; to the same CSS rule -- this usually solves it.
rocknbil

WebmasterWorld Senior Member rocknbil us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 4330418 posted 4:41 pm on Jun 24, 2011 (gmt 0)

For margins/padding in layouts, I'm with both alias and penders - I try to avoid it if possible as it usually means something is not right somewhere else, but negative values are extremely helpful in background positioning and absolutely positioned items.

It's also useful for anchors that are only images, but you want to have SE - digestible text in the anchor link:

<p id="facebook"><a href="https://www.facebook.com">See us on Facebook</a></p>

#facebook, #facebook a { display: block; width:32px; height: 32px; text-indent:-50000px; outline:none; border: none; text-decoration:none; }

This is **not** the same as the dreaded "hidden text" that SE's will ignore you for - as long as the link text is relevant and short, I've heard of no problems from this approach.

SuzyUK

WebmasterWorld Senior Member suzyuk us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 4330418 posted 10:25 pm on Jun 24, 2011 (gmt 0)

No!

There is nothing wrong with using negative values.. of margin especially! - in fact it can help with those JS/JQuery scripts, it is a perfectly valid CSS value.

forget all the rubbish about negative indenting or negative offsets, which are also both valid - the myths have become intertwined.

It is perfectly OK to use negative (minus) values you would just need to understand when to use one over the other.

Negative padding is not allowed, that makes sense, when on earth would you need to use negative padding?

Negative margins are great - want a slideshow or CSS3 transition? that's your property

Negative offset, also useful but watch out - remember that offsets leave space for the original element

Negative indenting, also perfectly fine or it wouldn't exist!

alt131

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 4330418 posted 12:48 am on Jun 25, 2011 (gmt 0)

I think the best response depends on context: Just because you "may" do something because it valid according to the recommendations doesn't mean you "should" write your code that way.

That's well-illustrated by the examples: a negative text-indent is widely supported as a technique to improve accessibility. Using it to load search-engine bait is black-hat SEO that will be penalised by search engines.

Negative off-sets (margin and position) have any number of useful applications. But we've all cringed at such (badly) over-engineered documents that the natural layout has been destroyed to point every single element has to be manually dragged back into the view-port because the content has been sent (as Lucy says so well) "into another universe".

As this is in the context of a cms jelly46, I'd ask the question at two levels.
  • Why are you using a negative to re-position elements? (If to achieve a legitimate outcome fine, but to "undo" issues caused by the basic styling of the document, probably not).
  • If you are using negatives to "undo" the styles imposed on you by the cms/don't have the autonomy to code as you choose: Should you be using that cms? (Client specifications make not give you freedom to change the cms, but if you do, having to "undo" the cms suggests that particular cms isn't the right tool for that particular job.)

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved