SitePoint Sponsor

User Tag List

Results 1 to 4 of 4
  1. #1
    SitePoint Zealot
    Join Date
    May 2007
    Location
    West Midlands, UK
    Posts
    173
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Headings and Sections

    Just a random question really.

    I am working on a site which is a single page. Its a tattoo shop's page. There isn't much content so a single page works.

    There are various sections in the page, 5 in total with small bits of text. Now each section is headed with a H2 which encloses the sections title.

    Usually I do this:
    Code:
    <div id="some-section">
    <h2>Section Name</h2>
    blah blah ...
    </div>
    But, I have had to include the heading outside the <div> now because of a style issue.

    Basically each section needs to have 50px padding on the left and right. The heading has an underline which spans 100% of the page width. If I apply the padding with the H2 inside the section the H2 also gets the padding because the padding is applied to the section div and not individual elements.

    Sorry if I am boggling the brain, lol.

    Anyway, just wondering if what I am doing is wrong. It seems like the quickest method to me with only the need for 1 declaration rather than applying padding to individual elements within all the sections.

  2. #2
    Design Your Site Team bronze trophy Erik J's Avatar
    Join Date
    May 2007
    Location
    Countryside, Sweden
    Posts
    3,407
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try put the heading where you usually do and use margins to negate the padding, e.g.:
    Code CSS:
    #some-section h2 {
        margin: 0 -50px 0 -50px;
        border-bottom: 2px solid #999;
        position: relative; /* for IE */
    }
    Happy ADD/ADHD with Asperger's

  3. #3
    SitePoint Zealot
    Join Date
    May 2007
    Location
    West Midlands, UK
    Posts
    173
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Totally forgot about negative margins.

    Just goes to show, you can work with CSS on a near daily basis for over 18 months and still forget the simple solutions.

  4. #4
    Design Your Site Team bronze trophy Erik J's Avatar
    Join Date
    May 2007
    Location
    Countryside, Sweden
    Posts
    3,407
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by cascadingstylez View Post
    Totally forgot about negative margins.

    Just goes to show, you can work with CSS on a near daily basis for over 18 months and still forget the simple solutions.
    We all need a push sometimes.
    Happy ADD/ADHD with Asperger's


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
  •