Een <aside> naast een afbeelding proberen te stapelen

Dus ik heb een artikeltag die in feite bestaat uit een hyperlink, een afbeelding, een knop en een terzijde.

De afbeelding is de afbeelding inline renderen en de zijkant naast elkaar gestapeld hebben. Om dit te kunnen doen, is dit wat ik aan het doen ben:

Title
<input type = "button" value = "share">

De CSS voor het bovenstaande is:

.friend_for_job img{
display:block 
}
.friend_for_job aside{
display:inline;
}

Dit heeft nu het gewenste effect op mijn img, het inline stapelen, maar geen effect op de side-tag, en het wordt weergegeven onder de HTML-tag.

0
Hoe helpt dat?
toegevoegd de auteur user1020069, de bron
cool..wachten op het antwoord!
toegevoegd de auteur user1020069, de bron
Het element img is een leeg element en mag geen eindtag hebben .
toegevoegd de auteur You, de bron
Waarschijnlijk niet (en daarom is het een opmerking en geen antwoord), maar u moet wel geldige HTML schrijven, omdat ongeldige HTML allerlei problemen kan veroorzaken.
toegevoegd de auteur You, de bron

2 antwoord

Allereerst heeft u een typfout: uw klas heeft de naam " friend_for_job ", maar u gebruikt " friendS_for_job ". En dan kunt u dit gewoon gebruiken:



Title
<input type = "button" value = "share">
0
toegevoegd
de typfout was omdat dit geen exacte kopie is, maar het is prima in de code. bedankt voor de code, maar hierdoor raakt alles door elkaar gegooid, de hyperlink en de knop maken zichzelf ongeschikt, terwijl eerder hun positionering geweldig was
toegevoegd de auteur user1020069, de bron
Dus de titel blijft zoals altijd bovenaan staan. Al het andere zweeft naast de afbeelding. Als u niet wilt dat de invoer zweeft, voeg dan een clearfix toe en deze komt weer onder de afbeelding. Of is het iets anders, wil je bereiken?
toegevoegd de auteur insertusernamehere, de bron

Is dit waar je op mikt?

.friends_for_job img { float:left; }
.friends_for_job aside { display:block; }

... het toevoegen van marge en opvulling naar smaak.

0
toegevoegd