login  Naam:   Wachtwoord: 
Registreer je!
 Forum

Links uitlijnen #headlinetitel

Offline RoyWilliam - 16/08/2005 09:03 (laatste wijziging 16/08/2005 09:04)
Avatar van RoyWilliamNieuw lid Beste CSS'ers .

Ik ben nieuw hier en ik heb even een vraagje. Ik ben momenteel bezig met racenieuws.net, maar iets lukt me de hele tijd niet. Als je naar www.racenieuws.net/2.0 gaat zie je drie nieuwsberichten en daaronder zie je "headlines f1" staan.

Het hoofdbericht met foto is één CSS hokje en de twee daarnaast staan ook apart in een css hokje. Headlines f1 natuurlijk ook.

Mijn probleem is nu, dat ik het niet voor elkaar krijg om het hokje #headlinetitel (dat is headlines f1) helemaal links uit te lijnen zoals het hoofdbericht.

#headline = hoofdbericht
#headline2 = twee berichten naast hoofdbericht
#headlinetitel = headlines f1

index.php:

<div id="top">
<img src="afbeeldingen/up.jpg">
<?
include "menu.php";
?>
</div>
<div id="site">
<div id="headline">
<?
include "nieuws.php";
?>
<div id="headline2">
<?
include "nieuws2.php";
?>
<br><BR><BR><BR>
<div id="headline">
<?
include "headlines.php";
?>
</div>
</div>
</div>


style.css:

BODY { font-family: verdana, helvetica, arial, sans-serif; FONT-SIZE: 10px;
color: #000000; background-color: #FFFFFF; }
H4 { color: #ffffff; background-color: #000000; width: 200px ; }
H2 { color: #000000; width: 200px ; }
H5 { color: #000000; width: 200px ; }

#text {
margin: 0px;
padding: 0px;
}

#site{
width: 758px;
border-right: 1px solid #000;
border-bottom: 1px solid #000;
border-left: 1px solid #000;
border-top: 1px solid #fff;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
min-height: 500px
}

#top{
width: 758px;
border-right: 1px solid #000;
border-left: 1px solid #000;
margin-top: 0px;
margin-right: auto;
margin-left: auto;
}

#headline{
width: 270px;
border-right: 1px solid #000;
margin-top: 30px;
position: relative;
left: 0px
top:0;
}

#headline2{
width: 285px;
margin-top: -285px;
position: relative;
left: 290px;
top:0;
}

#headlinetitel{
width: 270px;
border-right: 1px solid #000;
margin-top: 0px;
left: 0px
top:0;
}

7 antwoorden

Gesponsorde links
Offline BigBug - 16/08/2005 10:26
Avatar van BigBug PHP expert misschien met de functie text-align ??

vb:
php code - Bekijk de code zonder highlighting - Klap code in 
  1. <style type="text/css">
  2. body {
  3. text-align: left;
  4. }
  5. </style>
Offline RoyWilliam - 16/08/2005 10:33
Avatar van RoyWilliam Nieuw lid Nope....
Offline Janus - 16/08/2005 11:35
Avatar van Janus Nieuw lid Ik ga er vanuit dat je een tikfout hebt gemaakt in jouw bericht en dat de onderste <div headline> moet zijn <div headlinetitel>.

Probeer dit eens om in #site position:relative; te zetten en in #headlinetitel position:absolute; en dan positioneren...
Offline RoyWilliam - 16/08/2005 12:55
Avatar van RoyWilliam Nieuw lid Ja klopt... die had ik al aangepast aan headlinetitel...

Ik heb het nu hoe jij het zegt... en het is bijna goed ;)

check: www.racenieuws.net

Nu komt ie onder #site te vallen, maar dat moet niet.

Wat moet ik nu doen?
Offline dreamworld - 16/08/2005 16:37 (laatste wijziging 16/08/2005 16:46)
Avatar van dreamworld HTML beginner Als je nou die div waar de foto instaat een vaste waarde voor width en height mee geeft en een float left mee geeft en hetzelfde doet voor de div waar de tekst instaat. Dan krijg je dus 2 div`s naast elkaar. 1 div voor de foto en 1 div voor de tekst (nieuws in jouw geval)

Zo heb ik het namelijk ook op m`n site, alleen is de foto dan mijn menu.

EDIT: even een voorbeeldje: http://www.frer...t/main.htm

En de css file:
http://www.frer...layout.css
Offline RoyWilliam - 17/08/2005 08:44
Avatar van RoyWilliam Nieuw lid humz... ik heb het even gedaan, werkt opzich wel goed.... maar als ik bij #headline (degene met de foto) dan border bottom doe, dan gaat die border helemaal onderaan staan bij #site.

Ook heb ik dan problemen bij FireFox, want dan heeft de hele site geen omranding meer.
Offline dreamworld - 17/08/2005 18:11 (laatste wijziging 17/08/2005 18:16)
Avatar van dreamworld HTML beginner let wel op bij een vaste hoogte en breedte dat zodra je bijv een border toevoegd de andere waardes ook moet veranderen...

Bijv, je hebt links een div van 200px, je voegt hier een border aan toe van 1px en dan word die div opeens 201px, snap je wat ik bedoel?

Tis even proberen en spelen met dingen, dat voorbeeld wat ik gaf is ook nie binnen 5min gemaakt...ja nu misschien wel omdat ik weet hoe het moet en hoe Internet Explorer en FireFox er mee omgaan 

En de tekst in het voorbeeld... das een div in een div..
Gesponsorde links
Dit onderwerp is gesloten.
Actieve forumberichten
© 2002-2024 Sitemasters.be - Regels - Laadtijd: 0.207s