Pagina 1 van 1
Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 18:12
door t1mm3h
Ik heb de stijl: 2Unilever geinstalleerd.
Bij deze stijl zit er standaard een 'open' ruimte tussen de header en de bovenkant van de pagina.
Deze lege ruimte wil ik verwijderen zodat de header direct tegen de bovenkant van de site zit.
Er staat in de stylesheet.css een stukje waarmee het probleem opgelost moet kunnen worden, maar ik weet niet hoe.
Dit is het stukje code:
Code: Selecteer alles
#ipbwrapper{
margin: 0px auto 0px auto; /* centers the box, no matter the overall width, also applies a 20px gap at the top and bottom of the board */
margin-top: 0px
text-align: left; /* re_aligns text to left second part of two part MSIE centering workaround */
/* EDIT THIS TO CHANGE THE WIDTH OF THE BOARD -> 960px is a common fixed resolution size */
width: 827px;
}
Zoals te lezen is namelijk: also applies a 20px gap at the top and bottom of the board.
Dat wil ik dus op een manier weg hebben.
Wie kan mij vertellen hoe?
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 18:54
door Semi_Deus
Dit is wat je nodig hebt denk ik:
Code: Selecteer alles
#ipbwrapper{
margin: 0px auto;
margin-top: 0px
text-align: left;
width: 827px;
}
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 19:13
door t1mm3h
Dat had ik ook al geprobeerd met margin-top 0px maar helaas, werkt niet.
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 19:19
door Jim
Heb je je thema's vernieuwd na het uitvoeren van de wijziging?
Beheerderspaneel -> Stijlen -> Thema's -> Vernieuw
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 19:55
door t1mm3h
Jim schreef:Heb je je thema's vernieuwd na het uitvoeren van de wijziging?
Beheerderspaneel -> Stijlen -> Thema's -> Vernieuw
Ja.
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 20:15
door Johan
Post eens wat meer CSS? Ik denk dat het fout zit in de body (was bij prosilver wel zo, dacht ik)
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 20:28
door t1mm3h
Johan schreef:Post eens wat meer CSS? Ik denk dat het fout zit in de body (was bij prosilver wel zo, dacht ik)
Code: Selecteer alles
body {
background: #FFF;
color: #666666;
font-family: Verdana, Tahoma, Arial, "Trebuchet MS", Sans-Serif, Georgia, Courier, "Times New Roman", Serif;
font-size: 10px;
line-height: 135%;
margin: 0px;
padding: 0px; /* required for Opera to have 0 margin */
}
#wrapheader {
min-height: 120px;
height: auto !important;
height: 120px;
/* background-image: url('./images/background.gif');
background-repeat: repeat-x;*/
/* padding: 0 25px 15px 25px;*/
padding: 0;
}
#wrapcentre {
margin: 15px 25px 0 25px;
}
#wrapfooter {
text-align: center;
clear: both;
}
#wrapnav {
width: 100%;
margin: 0;
background-color: #ECECEC;
border-width: 1px;
border-style: solid;
border-color: #A9B8C2;
}
#logodesc {
margin-bottom: 5px;
padding: 5px 25px;
background: #D9DFE4;
border-bottom: 1px solid #4787A7;
}
#menubar {
margin: 0 25px;
}
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 12 jan 2009, 21:40
door Johan
Probeer eens wat te spelen met de paddings van de
#wrapheader
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 13 jan 2009, 00:38
door Semi_Deus
Code: Selecteer alles
#ipbwrapper{
margin: 0px auto;
margin-top: 0px //Dit is dubbelop
text-align: left;
width: 827px;
}
Die 2e margin is eigenlijk dubbelop, omdat het hetzelfde effect als: margin: 0px auto;
margin: 0px auto, zorgt er alleen ook nog voor dat de stijl gecentreerd wordt.
Kan je misschien ook even je overall_header.html plaatsen, je css ziet er opzich goed uit, maar als de div's misschien in een verkeerde volgorde staan kan het alsnog fout gaan.
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 13 jan 2009, 08:53
door t1mm3h
De divs uit de overall_header.html ->
Code: Selecteer alles
<div id="ipbwrapper">
<div id="header">
<div id="logo">
<a href="{U_INDEX}">
<img src="{T_THEME_PATH}/images/header.jpg"/></a>
</div>
<div id="top_menu"><ul class="menu" /></div>
<div id="menu"><ul class="menu">
<li id="current" class="active item1"><a href="{U_INDEX}"><span>Home</span></a></li>
<li class="item1"><a href="{U_FAQ}"><span>{L_FAQ}</span></a></li>
<li class="item2"> <!-- IF S_DISPLAY_MEMBERLIST --><a href="{U_MEMBERLIST}"><span>{L_MEMBERLIST}</span></a><!-- ENDIF --></li>
<li class="item3"><!-- IF S_DISPLAY_SEARCH --><a href="{U_SEARCH}"><span>{L_SEARCH}</span></a><!-- ENDIF --></li>
<li class="item4"> <!-- IF S_USER_LOGGED_IN --><a href="{U_PROFILE}"><span>{L_PROFILE}</span></a><!-- ENDIF --></li>
</ul></div>
</div>
<div id="userlinksguest">
<!-- IF not S_USER_LOGGED_IN -->
<p class="pcen"><b>Welkom</b>( <a href="{U_LOGIN_LOGOUT}">{L_LOGIN_LOGOUT}</a>)
<!-- ELSE -->
<!-- IF S_USER_LOGGED_IN -->
<p class="pcen"><b>Welkom </b> ( <!-- IF not S_IS_BOT --><a href="{U_LOGIN_LOGOUT}"><span class="login">{L_LOGIN_LOGOUT}</span></a> <!-- ENDIF --> ) <br />
<!-- IF S_DISPLAY_SEARCH -->
<p class="searchbar">
<span style="float: {S_CONTENT_FLOW_BEGIN};"><a href="{U_SEARCH_UNANSWERED}">{L_SEARCH_UNANSWERED}</a> | <a href="{U_SEARCH_ACTIVE_TOPICS}">{L_SEARCH_ACTIVE_TOPICS}</a></span>
<!-- IF S_USER_LOGGED_IN -->
<span style="float: {S_CONTENT_FLOW_END};"><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a> | <a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></span>
<!-- ENDIF -->
</p>
<!-- ENDIF -->
<br style="clear: both;" />
<!-- ENDIF -->
<!-- ENDIF -->
</p>
</div>
<div id="navstrip"><a href='{U_INDEX}'>{L_INDEX}</a></div>
<div style="padding:10px;padding-top:5px;border:1px solid #e3e3e3;">
Het is me gelukt!
Aangepast naar:
Code: Selecteer alles
#logo {
position: absolute;
left: 0;
top: 0px;
width: 827px;
height: 52px;
}
#menu {
position: absolute;
top: 52px;
background: #fb6400;
width: 825px;
height: 23px;
color: #fff;
border-top: 4px solid #E3E3E3;
border-bottom: 6px solid #E3E3E3;
}
#header {
position: relative;
left: 0;
top: 0;
height: 75px;
}
Dus naar aanleiding van aanpassingen in de height van deze divs.
Bedankt voor de reacties in ieder geval
Nou heb ik wel nog een vraagje, ik heb een navigatie menu bovenin, met de volgende css code:
Code: Selecteer alles
#menu {
position: absolute;
top: 52px;
background: #fb6400;
width: 825px;
height: 23px;
color: #fff;
border-top: 4px solid #E3E3E3;
border-bottom: 6px solid #E3E3E3;
}
nou wil ik de achtergrond van deze div een afbeelding geven. De afbeelding is precies 825*23px.
Als ik de code verander naar:
Code: Selecteer alles
#menu {
position: absolute;
top: 52px;
background-image: url (images/navbar.jpg);
width: 825px;
height: 23px;
color: #fff;
border-top: 4px solid #E3E3E3;
border-bottom: 6px solid #E3E3E3;
}
Echter als ik dan mijn pagina ververs wordt de menu balk gewoon een witte kleur.
Ik weet niet waardoor het komt maar het lijkt alsof; of het plaatje niet goed geplaatst wordt, of gewoon niet gevonden wordt, of dat er een andere code mijn plaatje overschrijft ofso?
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 13 jan 2009, 15:37
door Johan
url('images/navbar.jpg'); wel?
Re: Gehele layout 'tegen' bovekant aan
Geplaatst: 13 jan 2009, 17:14
door Paul
t1mm3h, graag niet dubbelposten. Ik heb je posts nu samengevoegd.