• Resolved Tee

    (@pumatalk)


    Here’s my blog;

    https://img32.imageshack.us/img32/6079/picture4phn.png

    The blog is set up in 3 colums

    -Left: Posts
    -Middle: Photo Gallery
    -Right: Movies Clips Gallery

    Notice the H1 title on the left gives the reader an idea of what they are looking at? Well I want to ad the same thing for the right & middle.

    -Middle: “Latest Photos”
    -Right: “Video Clips”

    In my Stylesheet here’s the code where I think i need to work with

    /********************************************
    Latest stories on the left
    ********************************************/
    .latest_stories h1 {
       font-size: 2em;
       letter-spacing: -1px;
       color: #f5006e;
    }
    
    .latest_stories h2 {
       font-size: 1.8em;
       margin: 0 0 10px 0;
    }
    .latest_stories h2 a {color: #000}
    .latest_stories h2 a:hover {text-decoration:underline}
    
    .latest_stories .last_date {
       display: block;
       line-height: 2.2em;
       font-family: georgia;
       font-style: italic;
       color: #666;
       border-bottom: 1px dotted #ddd;
    }

    And on the home.php template

    <!-- start left column -->
    <div id="leftcolumn">
    <div class="latest_stories">
    
    <h1><?php print LATEST_STORIES; ?></h1>
    <span class="last_date"><?php the_time('F d, Y'); ?></span>

    Im guessing I just need to pretty much copy the same type of code for the middle & right class?

    Middle (home.php)

    /<!-- start middle column -->
    
    <div id="middlecolumn">
    <div class="latest_stories">
    
    <h1><?php print LATEST_STORIES; ?></h1>
    <span class="last_date"><?php the_time('F d, Y'); ?></span>

    Middle (stylesheet.css)

    /********************************************
    Photos column in the middle
    ********************************************/
    .latest_stories h1 {
    	font-size: 2em;
    	letter-spacing: -1px;
    	color: #f5006e;
    }
    
    .latest_stories h2 {
    	font-size: 1.8em;
    	margin: 0 0 10px 0;
    }
    .latest_stories h2 a {color: #000}
    .latest_stories h2 a:hover {text-decoration:underline}

    And here’s what i got (the right side breaks…) https://www.adidas-talk.com
    https://img263.imageshack.us/img263/9329/picture2wjm.jpg

Viewing 2 replies - 1 through 2 (of 2 total)
Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘How to add H1 titles for the middle & right column (on 3 column layout)’ is closed to new replies.