[HTML/CSS] Ruzie met HR in IE/Opera

[We Are Borg]

Ik ben momenteel bezig een enorme htmlsoep om te zetten naar wat redelijk toonbare HTML. Website bestaat dus al en ik ga het proberen met wat betere HTML opnieuw op te bouwen vanwege diverse, voor jullie niet boeiende, redenen.

Nu is mijn uitgangspunt alles een beetje netjes te doen. XHTML i.c.m. CSS en een semantische gedachte bij het opnieuw maken van deze website.

Al redelijk ver gekomen voor iemand met beperkte HTML kennis, maar ik heb momenteel ruzie met een <hr /> i.c.m. met IE en Opera waardoor ik dus vastloop.

Allereerst de site. Ik heb even de logo's en namen verwijderd om zo niet spammerig over te komen, al zal hier niemand rondlopen die geintresseerd zal zijn in het product . Daarnaast wat rode borders neergezet om zo het een en ander te verduidelijken.

HTML: http://www.planet.nl/~terps407/got/index.html
CSS http://www.planet.nl/~terps407/got/css/default.css

Dan de plaatjes in verschillende browsers (laatste versie's):

http://www.planet.nl/~terps407/got/firefox.JPG (firefox doet het precies goed weergeven. Zo wil ik het graag hebben )
http://www.planet.nl/~terps407/got/opera.JPG (hr loopt precies in het midden, terwijl het net vanaf het blokje moet beginnen (zie firefox plaatje). Daarnaast klopt de tekst margin onderaan ook niet. Staat te dicht op de lijn)
http://www.planet.nl/~terps407/got/IE.JPG (hr verkeerd uitgelijnd en tekst totaal verkeerd).

Nu de vraag: hoe dit -netjes- op te lossen? Ik heb voor de hr manier dit eerst gedaan met een DIV en dan een bottom border 1px solid meegeven, maar dit is niet erg netjes. Deed het prima, maar wil toch graag een hr gebruiken want dat is het element wat het beste past. Kortom, een DIV is voor als nog geen goede oplossing. Ik heb wat zitten rotsooien met margins en paddin, maar helaas weinig effect.

De search gaf me ook wat topics terug, waaronder [rml][ CSS] HR-element niet goed in Opera[/rml] , maar helaas niet een werkbare oplossing voor mij

Is er een oplossing voor dit HR probleem of zal ik toch echt terug moeten naar mijn eerste DIV oplossing ?

[Woudloper]

Waarom wil je percé gaan voor een HR oplossing? Nu gebruik je de HR alleen als lijn onder je H2. Is het niet een optie om je H2 een border-bottom mee te geven?

[We Are Borg]

Dat is idd ook een goed idee. Ik heb de H2 een border bottom meegegeven. Helaas kon ik de width van de h2 niet defineren (werd genergeerd, dus zal vast niet kunnen), maar een divje heeft dat probleem opgelost. Toch nog een divje, maar alleen voor een width probleem. Ik ben tevreden

Thanks voor het idee

[BtM909]

We Are Borg schreef op 21 augustus 2004 @ 01:06:
Dat is idd ook een goed idee. Ik heb de H2 een border bottom meegegeven. Helaas kon ik de width van de h2 niet defineren (werd genergeerd, dus zal vast niet kunnen), maar een divje heeft dat probleem opgelost. Toch nog een divje, maar alleen voor een width probleem. Ik ben tevreden

Thanks voor het idee

Volgens mij is de width niet 'definieer-baar', omdat je H2 automagisch een block-element is.

Dat geldt natuurlijk in principe voor een inline element

[ Voor 8% gewijzigd door BtM909 op 21-08-2004 16:58 ]

[We Are Borg]

Dat zou goed kunnen. Ik wist het niet en heb het gewoon geprobeerd. Werkt niet, kortom, je hebt gelijk. DIVje erom heen gegooid en daar een width aan gekoppeld . Weer wat geleerd

[ Voor 11% gewijzigd door We Are Borg op 21-08-2004 01:12 ]

[crisp]

<h2 style="width:300px;border:1px solid red">h2 met width</h2>

[We Are Borg]

Misschien had het te maken met een andere width die ik domweg over het hoofd had gezien . Je hebt gelijk crisp en heb het ook aangepast

[Switch]

Misschien beetje offtopic, en wil ook niet vervelend doen ofzo Maar je site ziet er bij mij in Firefox absoluut niet uit zoals op je screenshotje (Firefox 0.9.3, 1152×864, XP)



Mocht je prutsen aan de layout terwijl ik keek, dan mag u dit bericht buiten beschouwing laten

[We Are Borg]

Mijn dank voor je input, maar ik was idd aan het prusten. Code is al weer verouderd Werkt prima (@localhost) in firefox 0.9.2 nu, dus ook vast in 0.9.3.

[ Voor 5% gewijzigd door We Are Borg op 21-08-2004 16:50 ]