Einzelnen Beitrag anzeigen
  #1 (permalink)  
Alt 20.12.2012, 16:19
Basti82 Basti82 ist offline
Benutzer
neuer user
Thread-Ersteller
 
Registriert seit: 23.07.2008
Ort: Idstein
Beiträge: 82
Basti82 befindet sich auf einem aufstrebenden Ast
Frage xhtml float Problem

Hallo zusammen,

ich habe ein kleines "float" Problem und hoffe das man es beheben kann:

HTML-Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>grid Test</title>
<style media="all" type="text/css">
	.wrap {
        width: 850px;
        overflow: hidden;
        position: relative;
    }
    
    .span6 {
        float: left;
        display: inline;
        width: 494px;
        background-color: #0CF;
        border-bottom: 1px solid red;
    }
    
    .span4 {
        float: left;
        display: inline;
        width: 324px;
        background-color: #9F6;
        border-bottom: 1px solid #690;
    }
    
    
    
    .wrap2 .span6 {
        float: left;
        display: inline;
        width: 494px;
        background-color: #0CF;
        border-bottom: 1px solid red;
    }
    
    .wrap2 .span4 {
        float: right;
        display: inline;
        width: 324px;
        background-color: #9F6;
        border-bottom: 1px solid #690;
    }
    
    .clean {
        clear: both;
    }
</style>
</head>

<body>
<h1>LIVE Markup</h1>
<div class="wrap">
    <div class="span6"><br /><br /><br /><br /><br /><br /><br />span6 - komplette inhalte links<br /><br /><br /><br /><br /><br /><br /></div>
    <div class="span4"><br /><br /><br /><br /><br />span4 - komplette inhalte rechts<br /><br /><br /><br /><br /></div>
</div>
<hr />
<h1>LIVE Markup</h1>
<h2>wie es bootstrap macht: float:left ; feste Breite</h2>
<div class="wrap">
	<div class="span6"><br /><br /><br />span6<br /><br /><br /></div>
    <div class="span6"><br /><br />span6<br /><br /></div>
    <div class="span6"><br /><br /><br /><br /><br />span6<br /><br /><br /><br /><br /></div>
    <div class="span4"><br /><br /><br />span4<br /><br /><br /></div>
    <div class="span4"><br /><br />span4<br /><br /></div>
    <div class="span4"><br /><br /><br /><br /><br />span4<br /><br /><br /><br /><br /></div>
</div>
<hr />
<h2>float:right ; feste Breite</h2>
<div class="wrap wrap2">
	<div class="span6"><br /><br /><br /><br />span6<br /><br /><br /><br /></div>
    <div class="span6"><br /><br />span6<br /><br /></div>
    <div class="span6"><br /><br /><br /><br /><br />span6<br /><br /><br /><br /><br /></div>
    <div class="span4"><br /><br /><br />span4<br /><br /><br /></div>
    <div class="span4"><br /><br />span4<br /><br /></div>
    <div class="span4"><br /><br /><br /><br /><br /><br />span4<br /><br /><br /><br /><br /><br /></div>
</div>


<hr />
<h1>neues Markup damit es passt</h1>

<div class="wrap">
	<div class="span6"><br /><br /><br /><br />span6<br /><br /><br /><br /></div>
	<div class="span4"><br /><br /><br />span4<br /><br /><br /></div>
    <div class="span6"><br /><br />span6<br /><br /></div>
    <div class="span4"><br /><br />span4<br /><br /></div>
    <div class="span6"><br /><br /><br /><br /><br />span6<br /><br /><br /><br /><br /></div>
    <div class="span4"><br /><br /><br /><br /><br /><br />span4<br /><br /><br /><br /><br /><br /></div>
</div>
</body>
</html>

Ich möchte bzw. kann ich nicht das Markup ändern, d.h. es müsste alles neben einander so wie im letzten Bsp. nur mit dem Markup von oben

Hat jemand noch eine Idee?!

DANKE!
Mit Zitat antworten
Sponsored Links