Problem mit Linkumrandung

Neuer!111

Hallo,

ich bau mir gerade nen kleines Movieportal und hänge leider noch am Design fest.
Und zwar habe ich ein Div in dem 3 Links als Menüpunkte angebracht sind, aber Auswahl Rahmen der Links ist mir viel zu groß (Also die Fläche in der ein Link angeklickt werden kann)

Ich hab hier mal nen Screen z.B. gemacht

[Blockierte Grafik: http://mitglied.lycos.de/bo20gonzo/prob.jpg]

Die graue Markierung zeigt an in welchem bereich ich alles den Menüpunkt Neuer Film anklicken kann, ich möchte aber das nur wenn man mit der Maus über Neuer Film geht diesen auch betätigen kann. (Ist bei den anderen beiden Punkten Film bearbeiten, erweiterte Suche das selbe Problem)...

Was muss man dafür ändern ?

//

Achja und noch eine Frage wie würdet ihr die untere Zeile

Film Name input type text | input type submit ausrichten ?

Ich hab den Input eine class zugewiesen, aber wenn ich dort z.B. bei Input Text padding-left wird damit nicht der abstand von Film Name zu dem Input Feld vergrößert sondern von dem Anfang des Inputfeles bis zum Ende (also quasi das was man mit size macht)

Jemmand ne Ahnung wie man sowas am besten ausrichtet ?

Auch wenn ich das Input text feld auf vertical-align: middle setze und dann
das Input Submit auf vertical-align: middle setze ist plötzlich das Input Text Feld nicht mehr mittig

Danke schonmal für Antworten

Elvis

Was hälst Du davon uns mal den Link zu geben?

sejuma

Wenn man nicht sehen kann, wie du das bisher gecodet hast, kann man leider auch keine Änderungs-Vorschläge unterbreiten.
Link oder Quelltext wären deshalb eine große Hilfe für uns (und damit vielleicht auch für dich)

Neuer!111

Sorry,

hatte das nur Lokal ich habs jetzt mal geuppt.

Also die Index ist hier

http://mitglied.lycos.de/bo20gonzo/fdb/

Die CSS hier

http://mitglied.lycos.de/bo20gonzo/fdb/style/main.css

jojo87

wenn du in der css bei a.menuepunkte das padding rausnimmst oder kleiner machst, wird auch der ganze link kleiner.
wenn das padding dazu da war, um einen abstand zwischen den links zu erreichen, nimm lieber margin, also den außenabstand, anstatt padding, den innenabstand.

Gruß
Jojo

Neuer!111

Danke,

damit hat sich das erste Problem gelöst

Wäre cool wenn vielleicht zu den anderen jemand was schreiben kann.

Ich bedanke mich schon mal !!!

jojo87

die angaben vertical-align etc gibts in css meines wissens nach nicht.
angaben zum positionieren findest du hier:
http://www.css4you.de

Elvis

Dann schreib ich auch mal was.....

Vor den <html>-Tag gehört nur eine Sache und das ist die Dokumentendeklaration!

Siehe hierzu auch: selfhtml - HTML-Grundgerüst, bzw.
Michael Jendryschik - Die globale Struktur eines XHTML-Dokuments

Weiterführenden Informationen:

Zitat

Der Grundgedanke des strukturorientierten Schreibens liegt in der Trennung des Informationsgehalts eines Dokuments von dessen äußerer Form. Um bei unserem Beispiel zu bleiben: Die semantische Auszeichnung eines Textes als Überschrift und dessen Formatierung (groß und fett) sind zwei unterschiedliche Paar Schuhe. Das Konzept wird als generic coding (allgemeine → Kodierung) bezeichnet und stammt bereits aus den 1960er-Jahren. Ebenfalls aus dieser Zeit stammt der Begriff generic markup, der auf den New Yorker Buchdesigner Stanley Rice zurückgeht. »→ Markup« bedeutet auf Deutsch »Textauszeichnung« und bezeichnete ursprünglich die handschriftlichen Anmerkungen eines Layouters am Rand eines Dokuments, die später im Satz berücksichtigt wurden. Auf diese Weise wurden das Seitenformat bestimmt und Seiteninhalte angeordnet sowie typografische Festlegungen getroffen.

Quelle: Michael Jendryschik - Einführung in XHTML, CSS und Webdesign

sejuma

So, ich hab dir mal was gebastelt und im IE6 wie FF getestet. Sollte also klappen (mit Doctype):

CSS (soweit für das zweite Problem erforderlich, bzw. was geändert wurde):

Code

a.menuepunkte
{
text-decoration: none;
color: white;
}


#Suche{


width: 600px;
background-color: black;
margin-left: 325px;
margin-right: 325px;
}


.suchdiv
{
width:200px;
margin:0 auto;
float:left;
text-align:center;
line-height:30px;
background-color: black;
height:70px;


}


.suche{
color: red;
}

Alles anzeigen

HTML

Code

<div id="Suche">
<div class="suchdiv">
   [url='neuer_film.php']Neuer Film[/url]
<hr>
 <span class="suche">Name des Film:</span>
</div>


<div class="suchdiv">
   [url='erweiterte_suche.php']Erweiterte Suche[/url]
<hr>
 <input style="width: 180px;" type="text" name="film_name"> 
</div>


<div class="suchdiv">
[url='erweiterte_suche.php']Erweiterte Suche[/url]
<hr>
<input type="submit" name="suche_film" value="Film suchen">
</div>
<br style="clear:both;">
</div>

Alles anzeigen

Die Bezeichnungen sind vielleicht jetzt nicht mehr so sinnvoll, aber kannst ja ändern.

Neuer!111

Danke dir

Tags