Norman Posted March 13, 2009 Share Posted March 13, 2009 Hello, check my image: I would like to this this type of page both with tables and with divs (just becouse I would like to be able to do this with tables and with divs). I don't understand how to put the right box ("Norman, avatar, INFO") there. Can you please help me? Link to comment Share on other sites More sharing options...
jlhaslip Posted March 13, 2009 Share Posted March 13, 2009 Show the code you have so far, please. Link to comment Share on other sites More sharing options...
Norman Posted March 13, 2009 Author Share Posted March 13, 2009 I have used this: <table width="100%"><tr><td width="60%" rowspan="1">ARTICLE TITLE</td><td width="40%" rowspan="2">Norman, avatar, info</td></tr><tr><td>Text text text </td></tr></table> But.. doing this, I get the "Norman, avatrar, info" table to have the height related to the height the "Text text text" table will have.And I don't want to do this.. Link to comment Share on other sites More sharing options...
jesh Posted March 13, 2009 Share Posted March 13, 2009 How about something like this? <html><head><style type="text/css">.article {background-color:#ccc;border:1px solid #000;padding:40px;}.article h2 {margin:0 0 20px 0;background-color:#0f0;}.article .avatarborder { border-style:solid; border-color:#ccc; border-width:0 0 40px 40px; float:right; margin:0 0 4px 4px;}.article .avatar { width:100px; border:1px solid #000; background-color:#ff0; padding:16px;}.article .content {background-color:#000;color:#fff;padding:8px;}.article .content p {margin:0 0 12px 0}</style></head><body><div class="article"><div class="avatarborder"><div class="avatar"><div>Norman</div><div>Avatar</div><div>Info</div></div></div><h2>ARTICLE TITLE</h2><div class="content"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque vehicula, nunc ac scelerisque tincidunt, massa enim tristique libero, sed consequat lectus velit in mi. Aliquam blandit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Aliquam eget orci. Aliquam vestibulum nunc a felis. Phasellus vel velit. Maecenasgravida sagittis tortor. Duis vestibulum mattis diam. Aliquam tincidunt, justo in aliquam sodales, augue enim feugiat lorem, ac dignissim urna libero eget sapien. Donec hendrerit velit id leo.</p><p>Morbi vel mi. Aenean tincidunt, massa eget porttitor pretium, mi magna mollis eros, at sagittis arcu orci non sapien. Phasellus justo dolor, interdum sit amet, pellentesque nec, ullamcorper nec, libero. Duis rutrum, quam sit amet vehicula ornare, magna purus interdum nibh, vel convallis diam dui sed ligula. Cras commodo, velit volutpat ultricies laoreet, sem sem faucibus arcu, non molestie tellus nulla in dolor. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Curabitur nibh neque, laoreet ac, gravida quis, lobortis non, arcu. Suspendisse at ante. Mauris sapien metus, gravida vitae, mattis id, pretium et, sapien. Nullam et ligula eget augue feugiat tincidunt. Nullam viverra,ipsum vel volutpat fringilla, magna nisl faucibus turpis, non porta tellus dolor a sapien. Ut lectus urna, ultricies id, consequat nec, sagittis sed, massa. Suspendisse eleifend erat at odio. </p></div></div></body></html> Link to comment Share on other sites More sharing options...
Ingolme Posted March 14, 2009 Share Posted March 14, 2009 That layout can't be done with tables. CSS gives you a lot more freedom than tables when doing layout. Link to comment Share on other sites More sharing options...
Norman Posted March 15, 2009 Author Share Posted March 15, 2009 Thank you jesh. Really helpfull!Ingolme: than there is no way I can do that type of layout using tabs? If I use a "<span style="float: right"><table.. </span>" in a table container? Link to comment Share on other sites More sharing options...
jlhaslip Posted March 15, 2009 Share Posted March 15, 2009 Thank you jesh. Really helpfull!Ingolme: than there is no way I can do that type of layout using tabs? If I use a "<span style="float: right"><table.. </span>" in a table container?why would you want to use Tables for this when a simple CSS solution is readily available? Link to comment Share on other sites More sharing options...
Renegade605 Posted March 15, 2009 Share Posted March 15, 2009 It doesn't really matter why he wants to do it...In any case, no, there is no way to do it with tables, because of the way it's organised. Link to comment Share on other sites More sharing options...
Norman Posted March 16, 2009 Author Share Posted March 16, 2009 why would you want to use Tables for this when a simple CSS solution is readily available?Just for knowledge. It doesn't really matter why he wants to do it...In any case, no, there is no way to do it with tables, because of the way it's organised.Ok, I understand. Thank you. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.