SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Noobie question remove padding on a certain page with class ID

    Heeelp please!!

    I am trying to remove padding controlled for one page whilst not affecting all other pages

    the padding is set in template .css

    .full-article .module-inner {
    padding:0 15px;

    I have set the page class suffix to image_article now i want to remove the padding on image_article page??

    how can i overide full-article .module-inner {padding:0 15px;}

    here is the xhtml

    <div class="bodycontent">
    <div id="maincontent-block">

    <div class=" imagearticle">
    <div id="page" class="full-article">

    <div class="module-tm"><div class="module-tl"></div><div class="module-tr"></div></div>
    <div class="module-inner">

    <div class="article-rel-wrapper">
    <h2 class="contentheading">
    Articles &amp; Publishing </h2>
    </div>





    <p>Read Articles on horse nutrition and horse care published by These are incomplete sample articles <span class=" ">If you would like to read or publish the full article in your club magazine or newsletter please contact us on the contact page!!</span><span class=" "><br /></span></p>

    <div class="article-ratings">
    </div>
    </div>
    <div class="module-bm"><div class="module-bl"></div><div class="module-br"></div></div>
    </div>
    </div>
    </div>
    </div>
    <div class="clr"></div>

    <div id="mainmodules2" class="spacer w99">
    <div class="block full">
    <div class=" bran4">
    <div class="moduletable">
    <div class="module-tm"><div class="module-tl"></div><div class="module-tr"></div></div>
    <div class="module-m"><div class="module-l"><div class="module-r">
    <div class="module-inner">

  2. #2
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    I'm assuming that the .imagearticle calss is only addded for hte image article page? If so you can just turn
    Code:
    .full-article .module-inner
    Into
    Code:
    .imagearticle .full-article .module-inner
    Yes? . Unless I'm missing something (or you have a slightly different HTML structure for the other segment)
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work

  3. #3
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks very much, you missed nothing im just learning

  4. #4
    SitePoint Enthusiast
    Join Date
    Jul 2006
    Posts
    38
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have noticed the bottom padding is also controlled by
    p {
    margin-top: 0px;
    margin-bottom: 0px;}

    do i need a class to override this?

    Thanks

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,564
    Mentioned
    6 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by travlar View Post
    Thanks very much, you missed nothing im just learning
    No problem lol . Normaly if it's something simple like that (and I haven't seen the OP to know how skilled they are) then I always think I'm missing an important detail
    Quote Originally Posted by travlar View Post
    I have noticed the bottom padding is also controlled by
    p {
    margin-top: 0px;
    margin-bottom: 0px;}

    do i need a class to override this?

    Thanks
    <p>s don't come with a default padding, but yes some browsers set a bottom margin on the <p> by default. You can control the defaults by setting it to whatever you wish.

    You don't technically need a class to override that, you just need more specificity (though I understnad what you are saying, and a class would probably be better for you)

    For example, this would override that (with a specificity of 2, compared to the regular specificity of 1 as in the CSS you just posted above)
    Code:
    div p{margin:/*whatever*/;}
    Twitter-@Ryan_Reese09
    http://www.ryanreese.us -Always looking for web design/development work


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •