WordPress.org

1. JonathanCutrell
   Member
   Posted 3 years ago #

   Ok, here's the code I am using
   

   .post {
   	padding-left: 8px;
   	padding-bottom: 90px;
   	padding-right: 8px;
   	padding-top: 20px;
   	background-image: url(bottomstripes.png), url(top_left.png), url(top_right.png), url(bottomleft.png);
   	background-position: right bottom, left top, right top, left bottom;
   	background-repeat: no-repeat;
   	border-left-style: none;
   	border-bottom-style: none;
   	border-right-style: none;
   	border-top-style: none;
   	margin-left: -10px;
   	margin-bottom: 20px;
   	background-color: #c7c7c7;

   And it shows up without the background images in Firefox. It shows up with the bg images in Safari. Validation says there's too many bg images, but I am not sure how to fix this, especially since it works in Safari.

2. whooami
   Member
   Posted 3 years ago #

   Validation says there's too many bg images

   Thats the holy grail, regardless of it working in one browser or all.

   Fix it by narrowing down your CSS declarations.

   .posttop { ...

   .posttopleft { ...

   so on and so forth.

3. JonathanCutrell
   Member
   Posted 3 years ago #

   Can you explain that a bit further? I am quite a bit confused about the declarations. Are those already defined somewhere up the line?

4. whooami
   Member
   Posted 3 years ago #

   Are those already defined somewhere up the line?

   I dont know I didnt look. Its your stylesheet, you can look.

   Im suggesting that you use more precise styling.

   .post {
   	background-image: url(bottomstripes.png) ...

   then:

   .posttopleft {
   	background-image: url(top_left.png) ...

   Obviously you will need to create the divs or whatever that all that extra stuff would be applied to.

   My point is, youre not using valid CSS currently, and cant expect your current solution to work across all browsers.

5. JonathanCutrell
   Member
   Posted 3 years ago #

   Thank you so much. This was the final code

   (messy, I'm guessing.)
   

   <div id="main">
   <?php if (have_posts()) : while (have_posts()) : the_post(); ?>
   
   <div class="post" id="post-<?php the_ID(); ?>">
   <div class="posttopleft">
   <div class="posttopright">
   <div class="postbottomleft">
   <div class="internalpost">
   <h1>
   <a>" rel="bookmark"><?php the_title(); ?></a></h1>
   
   	<h2><?php the_date('','<h2>','</h2>'); ?></h2>
   <div class="meta">
   <?php _e("Filed under:"); ?> <?php the_category(',') ?> —
   <?php the_author() ?> @ <?php the_time() ?> <?php edit_post_link(__('Edit This')); ?>
   </div>
   
   <div class="storycontent">
   <?php the_content(__('(more...)')); ?>
   
   </div>
   
   <div class="feedback">
   
   <?php wp_link_pages(); ?>
   
   <?php comments_popup_link(__('Comments (0)'), __('Comments (1)'), __('Comments (%)')); ?>
   </div>
   </div> <!-- internalpost -->
   </div> <!-- posttopleft -->
   </div> <!-- posttopright -->
   </div> <!-- postbottomleft -->
   </div> <!--closing .post -->
   
   <?php comments_template(); // Get wp-comments.php template ?>
   
   <?php endwhile; else: ?>
   
   <p>
   <?php _e('Sorry, no posts matched your criteria.'); ?>
   </p>
   
   <?php endif; ?>
   
   <?php posts_nav_link(' — ', __('« Previous Page'), __('Next Page »')); ?>
   			</div>
   			<!-- closing main div -->

6. whooami
   Member
   Posted 3 years ago #

   messy works, as long as its valid, and accomplishes your goal. does it work? is it valid?

7. JonathanCutrell
   Member
   Posted 3 years ago #

   It works. Checking validity now...

   and this is what I get.

   URI : file://localhost/TextArea
   34 h1 Value Error : font Helvetica is not a font-size value : Helvetica,sans-serif
   40 h2 Value Error : font Helvetica is not a font-size value : Helvetica,sans-serif,"Lucida Grande",Verdana,Arial
   62 #footer Value Error : float bottom is not a float value : bottom

   None of which are huge alarms.

   And then there's the warnings about text and bg color being the same, but that's all taken care of.

   So yes, it works.

   AND it's messy! :)

   Thank you so much

Topic Closed

This topic has been closed to new replies.