✔ span-container nicht inline projeziert

[Snowat2011]

Hallo,

ich hab nen problem und zwar hab ich in einem div-container 2 span-container.
einen fürs menu und einen für den text dann, bloß dass die beiden nicht auf gleicher höhe angezeigt werden sondern untereinander.

hat jmd ne idee was ich da falsch gemacht haben könnte oder wie man das problem löst?

code:

<div align="center">
	
<div class="header">
      <img src="./images/header.jpg" width="100%" height="100%"/>
</div>

<div class="main">
      <span class="menu">
            ...menu...
      </span>
      <span class="content">
            ...text...
      </span>
</div>

</div>

der div-container in dem das problem auftaucht ist: div class="main"


schon mal danke schön im vorraus
wenn fragen sind: nur zu.

mfg marius

 

[Maik]

Hi,

wenn fragen sind: nur zu.

wie lautet das Stylesheet zum gezeigten HTML-Code?

Und achte in deinen Beiträgen bitte auf die Groß- und Kleinschreibung, wie in der Netiquette erwünscht, vielen Dank.

mfg Maik

 

[Snowat2011]

div.main
{
padding-top: 40px;
padding-bottom: 40px;
text-align: left;
background-color: #999999;
margin-left: 20%;
margin-right: 20%;
position: relative;
}

span.menu
{
padding-top: 10px;
padding-bottom: 10px;
width: 15%;
maxwidth: 15%;
min-width:15%;
}


span.content
{
background-color: #FFFFFF;
}

und Entschuldigung wegen der Groß- und Kleinschreibung. Ich werd in Zukunft drauf achten

 

[Maik]

Erweiter den Quellcode mal folgendermaßen:

<div class="main clearfix"> ... </div>

span.menu
{
padding-top: 10px;
padding-bottom: 10px;
width: 15%;
maxwidth: 15%;
min-width:15%;
float:left;
}


span.content
{
background-color: #FFFFFF;
margin-left:15%;
}

.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

mfg Maik

 

[Snowat2011]

Recht herzlichen Dank.

Es hat funktioniert