TriAdX Posted March 2, 2007 Share Posted March 2, 2007 please check out http://www.forevertreasuredphotography.com/index.htmIn IE my div is pushed to the right of my image that is aligned left. The text followsin Firefox my div stays under the image and my text wraps around the image...What gives?How can i make it so it displays like the IE one in Fire fox.I know i could use position:absolute for everything.. but i'd rather not.Let me know! Thanks! Link to comment Share on other sites More sharing options...
S@m Posted March 2, 2007 Share Posted March 2, 2007 Check out this thread on conditional commenting:http://w3schools.invisionzone.com/index.php?showtopic=10662You can try on your style sheet for IE: position:relative;z-index:2; If there is floats in there, IE may not pick that up. You may have to float other things in order for the text to wrap correctly. Just a guess, but do a search on overflow as well. Link to comment Share on other sites More sharing options...
ScottR Posted March 2, 2007 Share Posted March 2, 2007 In order for anyone to know whats going on they will have to see your code. Please post that. Link to comment Share on other sites More sharing options...
jlhaslip Posted March 2, 2007 Share Posted March 2, 2007 check this out ==> Images and Text Blocks floated and displayed in-lineOne from column A and one from column B should work.The reason (I think) you are having trouble with this page is that it appears to be working fine using IE6. Then the problems begin when using other Browsers. Another problem, IMHO, is the basic page design seems to be a mix of Tables and CSS. This could be making the page behave weird, too. The transition from tables to full css design should be considered for the page. It would be easier for you to only have to deal with the single approach to the layout, the css site would load quicker, etc, etc... but that is your call...because your page looks fine in IE6, this tells me that your page was designed with IE6 in mind, so the code was written to look good in IE6, and this results in having to hack the standard compliant Browsers to behave in a manner which is against the Standards. Guaranteed you will have difficulties using this approach. For cross-browser designs, you are far better off designing to the Standard compliant Browsers and then hacking for IE versions by using Conditional Comments in the style selection to offer the IE specific CSS files as required. I believe that you will be able to avoid the use IE specific style sheets in this case, but you will need to extract a section of html from the Sample page, and some from the 2-column page. And the appropriate CSS, too. Combine them into the content div/table cell on your page and you are done.The explanation for the design is pretty straight forward. First create a div to contain the image and text div's. Images are floated left inside it's div, and given a width. Then the text inside it's own div is given a margin wider than the image, so they appear side by side.The image title and description on the Sample page are optional, of course. It doesn't appear that you would need or use them. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now