1. #1
    GregoryCo's Avatar
    Registered
    29/10/03
    Location
    Izegem
    Posts
    4,748
    iTrader
    25 (100%)
    Mentioned
    0 Post(s)
    Reputation
    6/9

    schaduw rond site, beste manier = ?

    Ik heb al verschillende methoden gezien op het internet hoe je een schaduw kan zetten rond uw website (content incl header en footer), maar tot nu toe is het alleen maar knoeien met photoshop. Ik heb ook een manier gezien om het volledig met html en css te doen, maar dat oogde niet echt mooi en professioneel.
    Bestaat er een of andere manier dat door alle browsers wordt ondersteund?
    Ik had ook al gedacht om de header, footer en content apart te ontwerpen in photoshop, en het ontwerp van de content te laten y-repeaten in CSS.

    Wat is volgens jullie de beste manier?

    dbvb
    no votes  

  2. #2
    legerguy's Avatar
    Registered
    28/12/05
    Location
    Merelbeke
    Posts
    539
    iTrader
    4 (100%)
    Mentioned
    0 Post(s)
    Ik gebruik een ander effect (de shadow fade weg ) Ik zet met CSS men Background helemaal naar de achtergrond door middel van de code z-index: -999.

    Das gewoon een DIV achter alle andere (wel ff klooien met de plaats tussen de bovenkant & de juiste plaats. Dat ius het moeilijkste.) De gemakkelijke weg is simpel in photoshop de shadow al zetten en zoals je zegt repeat-y voor de content
    The world is evil
    no votes  

  3. #3
    GregoryCo's Avatar
    Registered
    29/10/03
    Location
    Izegem
    Posts
    4,748
    iTrader
    25 (100%)
    Mentioned
    0 Post(s)
    Reputation
    6/9
    Kheb het zo gedaan
    Imagine Life Energy
    nu nog ff zoeken voor die content, want hij geeft problemen als de tekst verder gaat dan de afbeelding (footer verdwijnt voor een stuk en content wordt niet verlengt desondanks repeat-y)
    Last edited by GregoryCo; 01-12-2008 at 09:53.
    no votes  

  4. #4
    exxhal's Avatar
    Registered
    14/09/06
    Location
    Brasschaat
    Posts
    506
    iTrader
    5 (100%)
    Mentioned
    0 Post(s)
    Meestal gebruik ik drie delen.

    Ik maak een background en deze deel ik in 3 stukken.
    Dan maak ik drie divs met een foto boven het stuk dat ik repeat en een stuk eronder.
    De repeat zet ik dan als background. Zo kan er tekst komen nat.
    no votes  

  5. #5

    Registered
    19/09/05
    Posts
    1,911
    iTrader
    0
    Mentioned
    0 Post(s)
    de header en footer: schaduw meeslicen
    het middenstuk: repeat-y van een schaduw van 1pixel hoog en 5pixels breed
    no votes  

  6. #6
    GregoryCo's Avatar
    Registered
    29/10/03
    Location
    Izegem
    Posts
    4,748
    iTrader
    25 (100%)
    Mentioned
    0 Post(s)
    Reputation
    6/9
    Kheb het zo gedaan: (in photoshop gesliced en gezet adhv css in html

    html
    Code:
    <div id="header"></div>
        
        <div id="content">
        <div id="inhoudtekst"></div>
        </div>
        
    	<div id="footer"></div>
    css
    Code:
    #header{
    	background-image:url(afbeeldingen/header.jpg);
    	margin:auto;
    	background-repeat:no-repeat;
    	width:900px;
    	height:327px;
    	}
    #content{
    	background-image:url(afbeeldingen/inhoud.gif);
    	margin:auto;
    	background-repeat:repeat-y;
    	width:900px;
    	height:267px;
    	}
    #inhoudtekst{
    	width:648px;
    	height:374px;
    	float:right;
    	margin-right:35px;
    	margin-top:-110px;
    	}
    #footer{
    	background-image:url(afbeeldingen/footer.jpg);
    	margin:auto;
    	position:static;
    	background-repeat:no-repeat;
    	width:900px;
    	height:106px;
    	}
    Hij geeft dus nog enkel een fout als de #inhoudtekst verlengt wordt door tekst
    Last edited by GregoryCo; 02-12-2008 at 17:50.
    no votes  

  7. #7
    j design's Avatar
    Registered
    19/05/08
    Location
    Sjellebelle
    Posts
    731
    iTrader
    1 (100%)
    Mentioned
    0 Post(s)
    Ik heb juist een gedacht

    Je hebt de content div en die omsluit je door een ander div met een kleine padding 2à3px.
    Dan geef je die een donkergrijze kleur en een opacity van 0,4 ofzo
    De middenste div wit ofzo en dan denk ik dat je een css manier hebt voor een schaduw.

    * heb het nog niet geprobeert

    edit: voor je css min-height nemen ipv height
    Evulgo Media Where magic begins
    no votes  

  8. #8
    GregoryCo's Avatar
    Registered
    29/10/03
    Location
    Izegem
    Posts
    4,748
    iTrader
    25 (100%)
    Mentioned
    0 Post(s)
    Reputation
    6/9
    Dat met die min-height werkt precies niet content wil nog altijd niet mee
    maar kblijf zoeken
    bedankt
    no votes  

  9. #9
    j design's Avatar
    Registered
    19/05/08
    Location
    Sjellebelle
    Posts
    731
    iTrader
    1 (100%)
    Mentioned
    0 Post(s)
    #inhoudtekst{
    width:648px;
    height:374px;
    float:right;
    margin-right:35px;
    margin-top:-110px;
    }
    Waarom een float?

    En als je hier de height wegneemt en dan in #content ook, dat die automatisch aanpast.
    Lukt het dan ook niet?
    Evulgo Media Where magic begins
    no votes  

  10. #10
    GregoryCo's Avatar
    Registered
    29/10/03
    Location
    Izegem
    Posts
    4,748
    iTrader
    25 (100%)
    Mentioned
    0 Post(s)
    Reputation
    6/9
    Kheb het zo op zijn plaats gekregen adhv die float. De tekst mag enkel in het witte gedeelte, aan de rechter kant dus, maar dat zal je ongetwijfeld wel geweten hebben

    height wegnemen werkt ook niet
    no votes  

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Log in

Log in