I'm having problem in css.?

Question

Sometimes you get stuck to little things, same is happening with me. I am just pasting a part of my html. The problem is that text goes out of the div. Please help me. here is the code:

Reference: 999


Make: 999



Model: 9999


Comments: Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comments..Here are my comm

Answer 1

To fix it, remove float: right from detailslabel2, and add this to detailslabel: clear: both;



Personally though, I'd have used a table to contain the span stuff. People are so set up on the "DON'T USE TABLES!!!!" movement of CSS promotion, that they forget the purpose of tables: Holding tabular data. Which is what you have.



That way you don't have to mess with floats. Trust me, it'll be a lot easier on you.

Answer 2

It's going to take some time for me to take a look at this so i will copy it onto my computer and see what's going on. Also you should know that HTML/XHTML and CSS and sometimes act a little screwy. As for me, like EVERY time i am making bullet points in XHTML, it creates an extra one with no text there infront of it for no apparent reason.



----------------------------------------



Yeah try making your hight larger and instead of put your .details



----------------------------------------



If you ever had problems, just go to the w3c validator and copy and paste or HTML/XHTML into the search box and it will tell you if you have any errors.



W3C validator is at: http://validator.w3.org/#validate_by_input



----------------------------------------



I validated it and here is the error report:



Errors found while checking this document as XHTML 1.0 Transitional!

Result: 4 Errors, 1 warning(s)

Source:

Encoding:utf-8

Doctype:XHTML 1.0 Transitional

Root Element:html

Options

Show SourceShow OutlineList Messages Sequentially Group Error Messages by Type

Validate error pagesVerbose OutputClean up Markup with HTML Tidy

Help on the options is available.

Potential Issues



The following missing or conflicting information caused the validator to perform guesswork prior to validation. If the guess or fallback is incorrect, it may make validation results entirely incoherent. It is highly recommended to check these potential issues, and, if necessary, fix them and re-validate the document.

Mismatch between Public and System identifiers in the DOCTYPE declaration



This document uses an inconsistent DOCTYPE declaration. The Public Identifier -//W3C//DTD XHTML 1.0 Transitional//EN declares the XHTML 1.0 Transitional document type, but the associated System Identifier http://www.w3.org/TR/xhtml1/DTD/xhtml1-...


The recommended System Identifier for XHTML 1.0 Transitional is http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd.



The safest way to use a correct DOCTYPE declaration is to copy and paste one from the recommended list and avoid editing that part of your markup by hand.



↑ TOP



Validation Output: 4 Errors



Line 2, Column 13: "http:" is not a reserved name.



✉

Line 2, Column 13: cannot continue because of previous errors.



✉

Line 2, Column 13: XML Parsing Error: DOCTYPE improperly terminated.



✉

Line 2, Column 14: XML Parsing Error: Start tag expected, '<' not found.





----------------------------------------



If you need any more help please contact me at [e-mail]

Answer 3

Everything stayed in an outlined area on my computer. Even added more "comments" and the area expanded to properly.



You could make the styling much much simplier. Use

tags instead of the span and set classes for the various p-tags. For proper cascading, css is cascading style sheets, the declarations should first be for the block tags, body, p, hx, then text modifiers, then classes. Put them in the correct order and let the cascading to its thing.

Answer 4

Use a single celled table with a fixed width and height, and put that in the div. Set the border property to zero, so the border doesn't show. That way the text wraps if it gets too long. This is the easiest fix.

Answer 5

Which version of IE does you've gotten, set up IETester to study your internet website on diverse fashions of IE. in addition there are hacks on hand to paintings round with positioning in IE.

Answer 6

You need to add a height value to the div, large enough to contain all the text.

Answer 7

you could just add



height: 270px;



to the #ContentBody



but the problem is happening with your float:right in the .detailslabel2