Inline blocks somehow don't get displayed in a straight line
I'm creating a html newsletter to be sent by mail, and this is how far I
came:
<style type="text/css">
html {
padding: 0;
margin: 0;
font-family: Verdana, Geneva, sans-serif;
background-color: rgb(195, 186, 177);
}
.kasten {
color: #000;
display: inline-block;
border-size: 1px;
border-style: solid;
border-radius: 10px;
border-color: #493c2a;
margin: 7px;
padding: 0px;
box-shadow: 0px 0px 10px #222;
width: 300px;
height: 300px;
text-decoration: none;
}
#welpen {
background-image:url('http://hundegespuer.com/Images/neelixwelpe300.jpg');
}
#junghunde {
background-image:url('http://hundegespuer.com/Images/emma300.jpg');
}
#erwachsene {
background-image:url('http://hundegespuer.com/Images/hundewettrennen_kaya_otto_300.jpg');
}
#wasserspecial {
background-image:url('http://hundegespuer.com/Images/chap_wasser300.jpg');
}
#angst {
background-image:url('http://hundegespuer.com/Images/');
}
#apportieren {
background-image:url('http://hundegespuer.com/Images/');
}
#tricks {
background-image:url('http://hundegespuer.com/Images/');
}
#rufen {
background-image:url('http://hundegespuer.com/Images/');
}
#begegnungen {
background-image:url('http://hundegespuer.com/Images/');
}
#fuehrigkeit {
background-image:url('http://hundegespuer.com/Images/');
}
#stadt {
background-image:url('http://hundegespuer.com/Images/');
}
#wasser {
background-image:url('http://hundegespuer.com/Images/');
}
.kasten > * {
margin: 2px;
}
.desc {
display: block;
font-size: 13px;
text-align: justify;
}
.descBox {
font-size: 13px;
padding-left: 5px;
padding-right: 5px;
}
.top {
vertical-align: middle;
text-align: center;
}
.header {
font-size: 17px;
}
.stadt {
font-size: 14px;
text-align: center;
}
.datum {
font-size: 13px;
text-align: center;
}
.dateBox {
text-align: center;
line-height:2px;
border-bottom-style: solid;
border-bottom-color: #3A3B21;
border-bottom-width: 1px;
border-top-style: solid;
border-top-color: #3A3B21;
border-top-width: 1px;
}
.we {
display: inline-block;
padding-right: 7px;
}
.one {
display: inline-block;
padding-right: 7px;
}
.we p{
margin-top:1px;
}
.fi {
display: inline-block;
padding-left: 7px;
border-left-style: solid;
border-left-color: #3A3B21;
border-left-width: 1px;
}
.mehr {
color: #2054ff !important;
font-weight: bold;
text-decoration: underline;
}
.kurse {
}
</style>
<div class="kurse">
<a class="kasten" id="welpen"
href="http://hundegespuer.com/Leistungen#ErziehungskursWelpen">
<div class="top">
<h2 class="header">Gruppentraining – Welpen</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Fr – 30.8. – 17 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">Sa – 31.8. – 15 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
Der optimale Einstieg für Welpen zeigt sich durch die
Kombination aus Spieleinheiten, die das Sozialverhalten
fördern und abwechselnden Übungseinheiten, die dem
gezielten Bindungs– und Vertrauensaufbau sowie der
Grundlagenerziehung dienen. Die Welpenstunden finden an
unterschiedlichen Orten statt, so dass die Kleinsten bereits
an verschiedene Umwelteinflüsse herangeführt werden.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="junghunde"
href="http://hundegespuer.com/Leistungen#ErziehungskursJunghunde">
<div class="top">
<h2 class="header">Gruppentraining – Junghunde</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Fr – 30.8. – 18 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">Sa – 31.8. – 16 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
Junge Hunde versuchen oftmals ihre Stellung innerhalb der
Lebensgemeinschaft heraus zu finden. Meistern Sie auch diesen
Lebensabschnitt entspannt und mit der nötigen Portion
Gelassenheit. In der Gruppe üben wir alles was wichtig
ist für das ausgeglichene Zusammenleben von Mensch und
Hund in der Gesellschaft. Die Berücksichtigung der
individuellen Bedürfnisse eines jeden
Mensch–Hund–Teams steht dabei im Vordergrund.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="erwachsene"
href="http://hundegespuer.com/Leistungen#ErziehungskursErwachsene">
<div class="top">
<h2 class="header">Gruppentraining – erwachsene Hunde</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Fr – 30.8. – 19 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">Sa – 31.8. – 17 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
In den Erwachsenen–Erziehungs–Gruppen kann unter
Ablenkung von Artgenossen und Menschen weiter geübt
werden, was ohne Ablenkung bereits gut klappt. Der
Trainingsstand kann somit weiter ausgebaut, gefestigt und
Neues dazu gelernt werden.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="wasserspecial"
href="http://hundegespuer.com/Specials#Wasser">
<div class="top">
<h2 class="header">Wasser–Special</h2>
</div>
<div class="dateBox">
<div class="one">
<p class="stadt">Weiterstadt</p>
<p class="datum">Sa – 31.8. – 8:00 bis 9:30
Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
„Training für angehende Wasserratten“
heißt das Motto dieses Specials. Ihr Hund gruselt sich
etwas vor dem Wasser? Im Wasser herumtollen ist lustig, aber
sobald kein Boden mehr unter den Pfoten ist, fängt das
hektische Strampeln an? Bei diesem Special wird Ihr Hund
behutsam an das Wasser herangeführt und die Weichen
für ein ruhiges und stressfreies Schwimmen werden gelegt.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="angst"
href="http://hundegespuer.com/Leistungen#Angst">
<div class="top">
<h2 class="header">Gruppentraining – ängstliche und
verhaltensauffällige Hunde</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Sa – 31.8. – 12 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">So – 1.9. – 12 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
Hunde, denen beispielsweise der Umgang mit neuen Menschen oder
Artgenossen schwer fällt, sind in dieser Gruppe herzlich
willkommen. Gezielt werden bestimmte Situationen und
Umwelteinflüsse aufgesucht, um Ihren Hund durch
individuell abgestimmte Übungen den Umgang mit diesen
„Gefahren“ zu erleichtern...
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="apportieren"
href="http://hundegespuer.com/Leistungen#Apportieren">
<div class="top">
<h2 class="header">Beschäftigungsgruppenkurse –
Apportieren</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Sa – 31.8. – 10 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">So – 1.9. – 10 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
Das Apportieren fördert den Gehorsam des Hundes,
stabilisiert die Beziehung von Mensch und Hund und lastet den
Hund mental und körperlich aus. Ihr Hund sucht auf ein
Signal hin einen Gegenstand, nimmt das Objekt auf und bringt
es Ihnen auf direktem Wege zurück. Dies lässt sich
variieren und im Schwierigkeitsgrad steigern.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="tricks"
href="http://hundegespuer.com/Leistungen#Tricks">
<div class="top">
<h2 class="header">Beschäftigungsgruppenkurse –
Tricks</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Sa – 31.8. – 11 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">So – 1.9. – 11 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
Hier wird der Spaß garantiert! Es werden spielerisch auf
den Hund abgestimmte Kunststücke eingeübt, sodass
auch Senioren daran teilnehmen können. Dies fördert
die geistige Beweglichkeit, Kooperation und Findigkeit Ihres
Hundes. Trick–Training ist ideal, um den Hund auch bei
schlechtem Wetter im Haus auslasten zu können und sorgt
jederzeit für Abwechslung im Alltag.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="rufen"
href="http://hundegespuer.com/Leistungen#Rufen">
<div class="top">
<h2 class="header">Gruppentraining –
Rückruftraining</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Di – 3.9. – 18 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">Do – 5.9. – 18 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
Das Abrufen aus verschiedenen Situationen wie z.B. aus dem
Freilauf, aus dem Spiel mit anderen Hunden oder anderen
Ablenkungen wie z. B. einem Ball werden geübt und
gefestigt. Warum ist das sofortige Umkehren des Hundes
eigentlich so wichtig und wie kann dieses erreicht werden?
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="begegnungen"
href="http://hundegespuer.com/Leistungen#Begegnungen">
<div class="top">
<h2 class="header">Gruppentraining – Hundebegegnungen</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Di – 3.9. – 17 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">Mo – 2.9. – 17 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
„Hundebegegnungen entspannt meistern“ lautet das
Motto dieser Gruppe. Wie reagiere ich, wenn mein Hund erregt
ist, sobald ein Fremdhund kommt? Wieso reagiert mein Hund
überhaupt so (Freude oder Aggression)?
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="fuehrigkeit"
href="http://hundegespuer.com/Leistungen#Fuehrigkeit">
<div class="top">
<h2 class="header">Leinenführigkeit und Freifolge
Fuß</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Di – 3.9. – 19 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">Do – 5.9. – 17 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
„Entspanntes Gehen für Hund und Mensch“ ist
das Motto dieses Specials. Das Laufen an lockerer Leine
und/oder in der Freifolge werden geübt. Welche Übung
ist bei welchem Mensch–Hund–Team sinnvoll? Warum
ist die Leinenführigkeit für Hund und Mensch
wichtig?
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="stadt"
href="http://hundegespuer.com/Leistungen#Stadt">
<div class="top">
<h2 class="header">Stadttraining</h2>
</div>
<div class="dateBox">
<div class="we">
<p class="stadt">Weiterstadt</p>
<p class="datum">Mi – 4.9. – 18 Uhr</p>
</div><div class="fi">
<p class="stadt">Fischbachtal</p>
<p class="datum">Mo – 9.9. – 18:30 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
Das Stadttraining in der Gruppe beinhaltet das Üben und
Festigen von ablenkungsstarken Situationen wie das Laufen quer
durch die Innenstadt (mit Straßenbahnen und Bussen),
über verschiedene Untergründe oder entlang
unterschiedlicher Treppen. Auch ein–/ausfahrende
Züge, (eilige) Menschen, die Rollkoffer ziehen und eine
Fahrt mit dem Fahrstuhl können auf dem Programm dieses
Specials stehen.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
<a class="kasten" id="wasser" href="google.com">
<div class="top">
<h2 class="header">Beschäftigungsgruppenkurse –
Schwimmen</h2>
</div>
<div class="dateBox">
<div class="one">
<p class="stadt">Weiterstadt</p>
<p class="datum">Sa – 7.9. – 9 Uhr</p>
</div>
</div>
<div class="descBox">
<div class="desc">
„Training für angehende Wasserratten“
heißt das Motto dieses Beschäftigungskurses. Ihr
Hund gruselt sich etwas vor dem Wasser? Im Wasser herumtollen
ist lustig, aber sobald kein Boden mehr unter den Pfoten ist,
fängt das hektische Strampeln an? In diesem Kurs wird Ihr
Hund behutsam an das Wasser herangeführt und lernt das
ruhige und stressfreie Schwimmen.
<span class="mehr">Mehr...</span>
</div>
</div>
</a>
</div>
The problem is, the blocks don't get displayed in a single line, but
rather with some kind of "bumps", it's hard to explain so I'll show a
picture: http://abload.de/img/errorqep1x.png
Does anyone know how to fix this?
No comments:
Post a Comment