berechtigen Verbindungstext, der einem Bildikone folgt, wenn es einwickelt

Ich habe einen Link Link-Symbol auf der linken Seite und einen Pfeil auf der rechten Seite. Was ich habe Problem ist, wie der Link Text umschließt, rechtfertigt es nicht sehr gut. Wie kann ich etwas wie hier erreichen http://jsfiddle.net/MrLister/3xbfyqkh/, aber mit meinem gegebenen Markup?berechtigen Verbindungstext, der einem Bildikone folgt, wenn es einwickelt

<div class="linkitem" id="myTools" style= 
"display:inline-block; padding:4px 0 4px 0; width:90%;"> 
    <a href="{$ItemEditURL}" id="InlineEditLink" style= 
    "cursor: pointer; position:relative; top: 4px; margin-right:5px;"><img height="14" 
    src= 
    "https://maxcdn.icons8.com/Android_L/PNG/24/Programming/edit_property-24.png" 
    title="Edit" width="14"></a> <a href="{$SafeLinkUrl}" style= 
    "color: white !important!" target="_blank" title="{@LinkToolTip}">A 
    very long descriptive Link text goes here</a> 
</div> 
<div class="wrapperArrow" style="float:right; padding-top:5px;"><img alt="" 
src= 
"https://maxcdn.icons8.com/windows10/PNG/16/Arrows/double_right-16.png"></div><br> 

<br><br><br><br><br><br><br> 
<hr> 
Free Icons provided by <a href="https://icons8.com">Icons8</a>

Meine Geige hier ... https://jsfiddle.net/a2gruae6/

Quelle

2016-05-16 Athapali

Was ist der Unterschied zwischen den Proben, die Sie zur Verfügung gestellt? –

Der Hauptunterschied wird im Absatz angezeigt, wenn Sie die Größe ändern. Der Startpunkt der neuen Linie ist nach dem Symbol auf der ersten Geige und direkt unter dem Symbol auf der zweiten Geige. :) – Frits

aktualisieren Sie diesen Code in Ihrem Inline-Stil wie Ihr Problem lösen

<div class="linkitem" id="myTools" style= 
    "display:inline-block; padding:4px 0 4px 0; width:90%;"> 
     <a href="{$ItemEditURL}" id="InlineEditLink" style= 
     "cursor: pointer;position: absolute;float:left;width:20px;"><img height="14" 
     src= 
     "https://maxcdn.icons8.com/Android_L/PNG/24/Programming/edit_property-24.png" 
     title="Edit" width="14"></a> <a href="{$SafeLinkUrl}" style= 
     "color: white !important!;float:left;margin-left: 20px;" target="_blank" title="{@LinkToolTip}">A 
     very long descriptive Link text goes here</a> 
    </div> 
    <div class="wrapperArrow" style="float:right; padding-top:5px;"><img alt="" 
    src= 
    "https://maxcdn.icons8.com/windows10/PNG/16/Arrows/double_right-16.png"></div><br> 

    <br><br><br><br><br><br><br> 
    <hr> 
    Free Icons provided by <a href="https://icons8.com">Icons8</a>

Quelle

2016-05-16 14:11:54

Bitte nehmen Sie sich Zeit _explain_ was das Problem ist und warum Ihre Lösung funktioniert. Nur-Code-Antworten sind im Allgemeinen nicht sinnvoll und könnten abgelehnt werden. – andyb

berechtigen Verbindungstext, der einem Bildikone folgt, wenn es einwickelt

Antwort

Verwandte Themen