CSS Text Zeilenabstand innerhalb eines Div-Block

Wie würde ich meine text etwas nach Links, so dass es im Einklang mit dem Greifer von der orange bar befestigt? Wenn ich "Text-Align: Left" es bewegt sich zu weit nach Links. Danke für Eure Hilfe.

#orange-bar {
    width: 18%;
    height: 43px;
    position: left;
    margin: 2px 0px 0px 0px;
    background-color:#FF6633;
    font-family:'LinotypeUniversW01-Bold 723691';
    color:#FFFFFF;
    font-size: 17px;
    vertical-align:middle;
    line-height: 43px;}


<html>
<head>
<title>Instagram</title>
<script type="text/javascript" src="http://fast.fonts.com/jsapi/999aedb9-3bfd-4571-a6ad-   1d2b5e4de25f.js"></script>

<link href="/static/main.css" type="text/css" rel="stylesheet"/>
</head>
<body>
    <a href = '/instagram' id = 'header-name'></a>  
    <form method = 'post'>  
        <input onfocus="this.value=''" onblur="this.value='#tag search'" type = 'text'    name = 'tag' id = 'tag-search' value = '#tag search'></input>
    </form>
    <div>   
        <input type="submit" id = "submit">
    </div>      
    <div id = "header-bar"></div>
    <div id="orange-bar">#LOOKLAB</div>     
    <div id = "container">

Wir müssen Ihren html-code
Und das CSS für die white bar
Was ist position: left;?

InformationsquelleAutor Radha Kapoor | 2013-06-25

css

0

Könnten Sie versuchen, Polsterung:
```
#orange-bar {
    width: 18%;
    height: 43px;
    position: left;
    margin: 2px 0px 0px 0px;
    background-color:#FF6633;
    font-family:'LinotypeUniversW01-Bold 723691';
    color:#FFFFFF;
    font-size: 17px;
    vertical-align:middle;
    line-height: 43px;
}

#orange-bar p {
     padding-left:10px;   
}
```
Hier ist ein jFiddle um Ihnen zu zeigen, wie es aussieht.

Sie erwähnt in der Antwort, dass die Polsterung fügt, um die Breite der orange-bar div. Dies ist, weil die Polsterung, Ränder und Grenzen Auswirkungen auf die Breite des div auf die es angewendet wird (aus w3schools.com):

Wichtig: Wenn Sie die width-und height-Eigenschaften eines Elements
mit CSS, man muss nur die Breite und Höhe des content-Bereich. Zu
berechnen Sie die vollständige Größe eines Elements, müssen Sie auch fügen Sie die Polsterung,
Grenzen und Ränder.

Ein anderer Weg zur Lösung dieses Problem für Sie wäre die Anwendung der Polsterung an einem anderen tag (wie ein span, p oder verschachtelte div-Element), der besagt ganz einfach eine gepolsterte Höhe und nicht Breite).

Weitere Informationen wie padding, border und margin auf den Inhalt auswirken-Bereich, lese-bis auf die Box-Modell-Artikel w3schools.com.
- aber die Polsterung macht die orange div bar mehr als gut. Ich will nur zu bewegen, wird der text innerhalb der div.
- Ich überarbeitete meine obige Antwort, um zu erklären, wie der Inhalt Fläche betroffen ist von padding, margin und Grenzen.
- okay, danke - Sie sind genial!
InformationsquelleAutor doodelicious
1

Check-out die padding-left-Attribut für das element, das Sie wollen, um eine Linie mit der orange bar.
```
padding-left: 10px;
```
- Ich habe gerade den html code - es ist sehr einfach. @sergio ich bin nicht auf der Suche, wieder den weißen Balken. Alles was ich will zu tun ist, ziehen Sie das text-element um einige Pixel nach rechts im Orangen Balken, div, so dass es im Einklang mit meinem screengrab.
InformationsquelleAutor Chad Cook
0
```
position: left;
```
ist nicht die richtige css-Eigenschaft.
wenn ich Ihre Anfrage richtig Sie verwenden können, Polsterung wie folgt:
```
padding-left:5px;
```
wenn du mehr als einen div & anordnen wollen Sie alle im Links können Sie dann folgende css:
```
padding-left:5px; text-align:left;
```
und mit position-Befehl ist wie folgt:
```
position: absolute; left:20px;
```
- aber die Polsterung ist so mein "orange-bar" div mehr so gut. Ich will nur zu bewegen, wird der text innerhalb der div.
InformationsquelleAutor dpfarhad

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.