WordPress.org

Forums

[resolved] CSS coding not working :( ? (5 posts)

  1. Jam Castro
    Member
    Posted 5 years ago #

    Hi(",)Guys!
    I'm new here and I've been studying wordpress theme designing and developing for a couple of weeks now. Though I still have lot of things to learn. I already finished my first theme design, sliced it and it has xhtml codes already. I also started CSS coding but it seems it's not working :( .My designed theme should appear and some other styles should also have appear. All of my CSS coding is not working. Please, help me guys.

    Here's my CSS:

    /*
    Theme Name: blue
    Theme URI: the-theme's-homepage
    Description: my firt theme design
    Author: Jam Castro
    Author URI: your-URI
    Version: 1.0

    General comments/License Statement if any.
    */

    body, h1, h2, h3, h4, h5, h6, blockquote, p{
    margin: 0;
    padding: 0;
    }

    body{
    margin: 0;
    font-family: Arial, Helvetica, Georgia, Sans-serif;
    font-size: 12px;
    text-align: center;
    vertical-align: top;
    color: #000000;
    }

    h1{
    font-family: Georgia, Sans-serif;
    font-size: 24px;
    padding: 0 0 10px 0;
    }

    a:link, a:visited{
    text-decoration: underline;
    color: #336699;
    }

    a:hover{
    text-decoration: none;
    color: #ff0000;
    }

    p{
    padding: 10px 0 0 0;
    }

    #wrapper{
    margin: 0 auto 0 auto;
    width: 1024px;
    text-align: left;
    }

    #blog-01 {
    position:absolute;
    left:0px;
    top:0px;
    width:32px;
    height:768px;
    background:url(images/blog_01.jpg);
    }

    #header {
    position:absolute;
    left:32px;
    top:0px;
    width:669px;
    height:120px;
    background:url(images/header.jpg);
    }

    #blog-03 {
    position:absolute;
    left:701px;
    top:0px;
    width:291px;
    height:71px;
    background:url(images/blog_03.jpg);
    }

    #blog-04 {
    position:absolute;
    left:992px;
    top:0px;
    width:32px;
    height:768px;
    background:url(images/blog_04.jpg);
    }

    #searchbox {
    position:absolute;
    left:701px;
    top:71px;
    width:206px;
    height:49px;
    background:url(images/searchbox.jpg);
    }

    #magnifyingglass {
    position:absolute;
    left:907px;
    top:71px;
    width:29px;
    height:49px;
    background:url(images/magnifyingglass.jpg);
    }

    #blog-07 {
    position:absolute;
    left:936px;
    top:71px;
    width:56px;
    height:49px;
    background:url(images/blog_07.jpg);
    }

    #menu {
    position:absolute;
    left:32px;
    top:120px;
    width:960px;
    height:35px;
    background:url(images/menu.jpg);
    }

    #left-col {
    position:absolute;
    left:32px;
    top:155px;
    width:180px;
    height:485px;
    background:url(images/left-col.jpg);
    }

    #featured {
    position:absolute;
    left:212px;
    top:155px;
    width:360px;
    height:185px;
    background:url(images/featured.jpg);
    }

    #about-box {
    position:absolute;
    left:572px;
    top:155px;
    width:251px;
    height:185px;
    background:url(images/about-box.jpg);
    }

    #sidebar {
    position:absolute;
    left:823px;
    top:155px;
    width:169px;
    height:485px;
    display: inline;
    background:url(images/sidebar.jpg);
    }

    #container {
    position:absolute;
    left:212px;
    top:340px;
    width:611px;
    height:300px;
    background:url(images/post-box.jpg);
    }

    .post{
    padding: 10px 0 10px 0;
    }

    .post h2{
    font-family: Georgia, Sans-serif;
    font-size: 18px;
    }

    .entry{
    line-height: 18px;
    }

    p.postmetadata{
    border-top: 1px solid #ccc;
    margin: 10px 0 0 0;
    }

    .navigation{
    padding: 10px 0 0 0;
    font-size: 14px;
    font-weight: bold;
    line-height: 18px;
    }

    #footer {
    position:absolute;
    left:32px;
    top:640px;
    width:960px;
    height:128px;
    background:url(images/footer.jpg);
    }

    Here's my XHTML:

    <?php get_header(); ?>

    <div id="container">
    <?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>

    <h2>"title="<?php the_title(); ?>"><?php the_title(); ?></h2>

    <div class="post" id="post-<?php the_ID(); ?>">

    <div class="entry">

    <?php the_content(); ?>

    <p class="postmetadata">
    <?php _e('Filed under:'); ?> <?php the_category(', ') ?> <?php _e('by'); ?> <?php the_author(); ?>
    <?php comments_popup_link('No Comments »', '1 Comment »', '% Comments »'); ?> <?php edit_post_link('Edit', ' | ', ''); ?>
    </p>

    </div> <!-- entry div end -->

    </div> <!-- post div end -->

    <?php endwhile; ?>

    <div class="navigation">
    <?php posts_nav_link(); ?>
    </div>
    <?php else : ?>

    <div class="post" id="post-<?php the_ID(); ?>">
    <h2><?php _e('Not Found'); ?></h2>
    </div>

    <?php endif; ?>

    </div> <!-- container div end -->

    <?php get_sidebar(); ?>

    <?php get_footer(); ?>

    </body>

    </div> <!-- wrapper div end -->

    </html>

  2. jrav001
    Member
    Posted 5 years ago #

    In your header.php, is it looking for the correct style sheet?

  3. Jam Castro
    Member
    Posted 5 years ago #

    Yap, it's looking for the correct style sheet.

    Here's my header.php

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title><?php bloginfo('name'); ?><?php wp_title(); ?></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <link rel="style sheet" type="text/css" href="style.css">
    </head>

    <body>

    <div id="wrapper">

    <div id="header">
    <h1>"><?php bloginfo('name'); ?></h1>
    <?php bloginfo('description'); ?>
    </div>

    <div id="menu">
    HOME
    NEWS
    CONTACT
    LINKS
    </div>

    <!-- End header.php -->

  4. jrav001
    Member
    Posted 5 years ago #

    The style link should look more like this:
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />

  5. Jam Castro
    Member
    Posted 5 years ago #

    YESSSSS(",)!!! it's finally working!!!
    Thank you so much jrav001
    You really help me out(",), I really appreciate it a lot.

Topic Closed

This topic has been closed to new replies.

About this Topic