WordPress.org

1. startribe
   Member
   Posted 6 years ago #
   

   Hey Community,

   Me and my CSS designer ran into a bit if a problem, and any ideas would be greatly appreciated.

   We are having a problem getting ie in windows...
   ( http://diablovalleydesign.com/out_pics/windows.jpg )
   to display as it should in firefox...
   ( http://diablovalleydesign.com/out_pics/firefox.jpg )

   Note the text isn't wrapping around our post-image.

   The html code can be viewed at:
   http://wordpress.pastebin.ca/321709

   And the CSS code can be viewed at:
   http://wordpress.pastebin.ca/321716

   We have been stuck on this one, so again, any ideas or suggestions would be greatly appreciated.

   -Orion

2. Samuel B
   moderator
   Posted 6 years ago #
   

   Is a link possible? It's so much easier.

3. startribe
   Member
   Posted 6 years ago #
   

   Sure, our development site is at (note this url will change):
   http://ostardesign.com

   We are still prepping for content, flash, and etc, so please ignore the content outside of the articles.

   Thanks for the reply Samboll, and any help or suggestions are welcome.

   -Orion

4. Samuel B
   moderator
   Posted 6 years ago #
   

   Wow - I really like your theme.
   Here are a few things you should fix.
   http://validator.w3.org/check?uri=http%3A%2F%2Fostardesign.com%2F
   The character encoding mismatch isn't good at all.

5. startribe
   Member
   Posted 6 years ago #
   

   Hey Samboll,

   I will pass this on to my CSS guy, Travis, for review and thoughts.

   Thank you very much for the compliments on the theme, we are almost complete, not to much longer. We are actually working on trying something different for the logo, for we are not sure if we want to commit to something delicate or ornate when our direction is strong & sporty.

   Thank you again, and if there are any other ideas specific to our issue, anyone, please feel free to chime in. I'm looking forward to changing this to a resolved topic.

   -orion

6. Doodlebee
   Member
   Posted 6 years ago #
   

   Okay, first of all, you *cannot* break up a <p> tag like that. You can put a <p> within a <div>, but not the other way around. And really, there's no need for a div there, anyway - you can just assign a class to the <a> link and be done with it - no extra markup.

   You should also move the image to *before* the date, then you don't have to use the extra negative margin to move it into position.

   So make it look more like this (I removed the extra junk so you could see what's going on):

   <div class="post" id="post-24">
<div class="news_header">
<h5>Training</h5>
<a href="#">RC Video Training</a>
</div> <!-- /news_header-->
<img class="post-image" src="image.jpg" alt="" />
<h6>January 5th, 2007</h6>
<p>
text here text here
<a href="#">read more</a>
</p>
</div> <!-- /post -->

   div.post {
   width:250px;
   float:left;
   clear:left;
   }

   div.news_header h5, div.news_header a {
   float:left;
   margin-right:25px;
   }

   img.post-image {
   clear:left;
   float:left;
   width:100px;
   margin:0 5px 5px 0;
   }

   That's all off the top of my head, and of course you'll have to play with it a bit, but that should work just fine and dandy.

7. startribe
   Member
   Posted 6 years ago #
   

   Thanks Doodlebee,
   I will send this to Travis, he may not be working on it until tonight or tomorrow. I am currently booked up on getting the forum up and going.

   Any other feedback is welcome.
   Thanks again Doodlebee,
   -orion

8. Root
   Member
   Posted 6 years ago #
   

   I wouldn't use the code / CSS posted above. It is going to be unstable.

   Just my 2c.

9. startribe
   Member
   Posted 6 years ago #
   

   Hey Root,
   Any suggestions on what I should use, and possibly why?

   Thanks, we are getting ready to tackle this now.
   Orion

10. Root
    Member
    Posted 6 years ago #
    

    When I use floats I just put in the float and the width. Thats it. Margins in floats can lead to all manner of funkiness, which leads to more support requests, followed by butt ugly hacks suggestions. And definitely no clearing in a floated element. Save yourself a big headache.

11. startribe
    Member
    Posted 6 years ago #
    

    Hey Community,
    I was able to resolve the issue. The CSS was actaully being inherihited differently in IE then it was in Firefox. So I had to change some of my other pages that were using a similar CSS. With the modifcations we were able to get the text to wrap in IE 6.

    Also, thanks for the heads up on the validation issue. We took care of the Meta problem and included the appropriate script to at least validate that issue. The others we will have to put on hold for now.

    Thank you so much for getting the gears turning.

    All the Best,
    Orion

12. Doodlebee
    Member
    Posted 6 years ago #
    

    It is going to be unstable.

    It *can* be unstable, if the coder doesn't know what they're doing. Since he's actually using someone to code the site, I would hope that they know what they are doing.

    But for the record, I've used the above code before in sites with no problem - and yes, across browsers all the way to IE5 for Mac. (And with no hacks.)

Topic Closed

This topic has been closed to new replies.