elijahlucian Posted May 13, 2009 Share Posted May 13, 2009 http://ultimatecarpet.ca/services.shtmlso on this page. im using a div container like this<div id="container">then im floating one left: <div id="sidebar" style="float:left; blah blah"> </div>and one right<div id="text" style="float:right; blah balh"> </div></div> no im not using inline style tags im just trying to show you what's going on...butwhen i add text to my "text" div it goes out of the bounds of the container... making my page look wacked. how can i make my container autosize to the content of the div's inside it? Link to comment Share on other sites More sharing options...
jlhaslip Posted May 13, 2009 Share Posted May 13, 2009 Which div is giving you trouble?Why can't you show two lists side by side on the right hand column so the scrollbar goes away? That would place your Link "above the fold" and more clicks would result.Also, those "bodyheader" elements are headings. To do it correctly, they should be H2 or H3 tags instead of a classed div. Search engines would like that better, I think. Better page structure. More semantic. Link to comment Share on other sites More sharing options...
Ingolme Posted May 13, 2009 Share Posted May 13, 2009 You don't need to add float: right to the second column. That usually causes trouble.It is also important to define a width for your floated elements, and to add margins to the elements that aren't floated but are next to them. <div style="float: left; width: 200px;">Left column</div><div style="margin-left: 200px;">Main column</div> Link to comment Share on other sites More sharing options...
elijahlucian Posted May 13, 2009 Author Share Posted May 13, 2009 You don't need to add float: right to the second column. That usually causes trouble.It is also important to define a width for your floated elements, and to add margins to the elements that aren't floated but are next to them.<div style="float: left; width: 200px;">Left column</div><div style="margin-left: 200px;">Main column</div> ingolme i took off the float on the right text part and added a margin, and its still overflowing... so what take a look at the pagehttp://ultimatecarpet.ca/services.shtmlill leave it like it is until i got a response. thats why i put the scrollbar in. i am still goign to put pictures on teh right floating, becasue its what the client wants.changed the tags, thanks for the tip. what do i use if i just want to bold one part of the line? the <hx> tags wont work Link to comment Share on other sites More sharing options...
Ingolme Posted May 13, 2009 Share Posted May 13, 2009 I forgot to mention that if you don't want floated to overflow from their container, add overflow: auto to the container.If you want bold in only one part of the text, you can use a span: <p>This is <span style="font-weight: bold;">bold</span> text.</p> Link to comment Share on other sites More sharing options...
elijahlucian Posted May 13, 2009 Author Share Posted May 13, 2009 I forgot to mention that if you don't want floated to overflow from their container, add overflow: auto to the container.If you want bold in only one part of the text, you can use a span:<p>This is <span style="font-weight: bold;">bold</span> text.</p> ok but look what overflow:auto doeshttp://ultimatecarpet.ca/services.shtmlit just adds a scrollbar. what i want to do is stretch the height of the container to fit the text. Link to comment Share on other sites More sharing options...
thescientist Posted May 13, 2009 Share Posted May 13, 2009 you can always add another div with "clear: both" (like a footer or something. that should stretch the container div down. Link to comment Share on other sites More sharing options...
Ingolme Posted May 13, 2009 Share Posted May 13, 2009 ok but look what overflow:auto doeshttp://ultimatecarpet.ca/services.shtmlit just adds a scrollbar. what i want to do is stretch the height of the container to fit the text.Which browser are you looking at your page with? Firefox 3, Internet Explorer 7 and Opera all display the page correctly. Link to comment Share on other sites More sharing options...
thescientist Posted May 13, 2009 Share Posted May 13, 2009 yeah, it looks fine in FF3 Link to comment Share on other sites More sharing options...
elijahlucian Posted May 14, 2009 Author Share Posted May 14, 2009 ah yes. im sorry i totally forgot to say it was fixed.actually it was my fault lol in the container tag i had a height specified at 400px. instead of min-height :S sorry guys. but thanks!!!! been a great help here! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.