DIV centreren

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

.NET Developer

Functie omschrijving .NET developer met ervaring gezocht! Voor een softwarebedrijf in de regio Veenendaal zijn wij op zoek naar een .NET developer met een aantal jaar ervaring. Jij bent zowel zelfstandig als in teamverband verantwoordelijk voor het ontwikkelen en verbeteren van bestaande producten. Verder ben je bezig met nieuwbouw van websites, webapplicaties en mobiele applicaties die zowel intern als extern gebruikt worden. Je werkt hierbij nauw samen met andere developer, productmanagers en productspecialisten om zo mooie producten te creëren. Bedrijfsprofiel De organisatie waar je voor gaat werken is een snelgroeiende softwareleverancier en allround dienstverlener. Deze organisatie heeft zowel klanten die

Bekijk vacature »

Starter/junior Magento developer gezocht!

Functie Je komt te werken in een zelfsturend team waarin vertrouwen voorop staat en inbreng en ideeën worden gewaardeerd. Ook staat innovatie centraal. Ze bieden jou de mogelijkheid om jezelf door te ontwikkelen. Denk hierbij aan cursussen en een persoonlijk ontwikkelplan. Je komt terecht in het team van momenteel 4 (ervaren) collega’s en zal meewerken aan de doorontwikkeling en nieuwbouw van de Magento platformen van meerdere opdrachtgevers volgens Agile/Scrum. Denk hierbij aan nieuwe functionaliteiten, UX en koppelingen met verschillende back-end systemen. Als starter/junior developer zul je direct begeleid worden door een senior uit het team. Het is van belang dat

Bekijk vacature »

Front-end Developer

Onze klant is sinds 2 jaar actief als adviseur en bemiddelaar in de verzekeringsmarkt. Sindsdien proberen zij deze slapende markt flink wakker te schudden. Dit willen zij doen door het bouwen van slimme vergelijkers op hun eigen website en die van partners. Het bedrijf wil continu voorop lopen, zodat consumenten eenvoudig de verzekeringen kunnen vinden die het beste bij ze past. Functieomschrijving Als Front-end Developer werk je aan vergelijkingsmodules die consumenten dagelijks gebruiken bij het vergelijken en afsluiten van verzekeringen. Je vindt het leuk om samen te werken met de product owner, bestaande modules te verbeteren en nieuwe vergelijkers "from

Bekijk vacature »

PHP Software Developer

Functie omschrijving PHP Software Developer gezocht! Voor een organisatie in de regio Zeist die zich bezighoud met het verbeteren van de medicatieveiligheid zoeken wij een Software Developer. In deze functie zijn wij op zoek naar een slimme en enthousiaste Developer die interesse heeft in farmacie, logistiek en ICT. Daarnaast beschik je over een goed analytisch vermogen en ben je van nature gestructureerd en resultaatgericht. Je moet in deze functie daadkrachtig, flexibel en communicatief goed zijn. Je verantwoordelijkheden bestaan uit: Object georiënteerd programmeren; Werken in een scrumteam aan de ontwikkeling van een medicatiebewakingssysteem; Meedenken over de mogelijkheden en onmogelijkheden van projecten;

Bekijk vacature »

Junior Java Developer

Dit ga je doen Je ontwikkelt innovatieve, maatschappelijk belangrijke applicaties; Je implementeert nieuwe features; Je gaat in gesprek met eindgebruikers en designers om de applicaties continu te finetunen; Je draait mee in een professionele Agile/Scrum omgeving. Hier ga je werken Onze klant is een internationale organisatie gevestigd in de omgeving van Amsterdam. Ze staan zeer goed bekend in de markt door hun innovatieve dienstverlening op IT gebied en hun gepassioneerde werknemers. Voor hun inspanningen op het gebied van IT hebben ze meerdere prijzen gewonnen! Onze klant is onderdeel van een Corporate werkgever en heeft zelf 300 mensen in dienst. Om

Bekijk vacature »

Python developer Consultancy

Functie Als Python developer bij deze organisatie werk je voor verschillende klanten. Doordat de oprichter een groot netwerk heeft kun je zelf voorkeuren uitspreken in het type projecten dat je wilt gaan doen. Zo zijn er bijvoorbeeld langdurige of juist korte projecten, maar is ook het type klant, of project bespreekbaar. Werk jij bijvoorbeeld graag aan een nieuw, state-of-the-art web portaal of ben je liever betrokken bij een migratietraject van een bestaande applicatie? Wij gaan voor jou aan de slag! Eisen • Je bent een gedreven developer met sterke voorkeur voor Python • Je bent meer dan een codeklopper •

Bekijk vacature »

Front-end developer gezocht

Functie Je komt in een team met ambitieuze developers die de passie voor Front-End met jou delen. Samen ga je aan de slag met leuke en leerzame opdrachten. Het team heeft een eigen budget en financiën en zij bepalen zelf hoe dat besteed en investeert wordt. Je gebruikt tools als JavaScript, Node.js, React, Angular, Typescript en Vue.js wanneer je werkt aan de opdrachten. Daarnaast zul je veel leren van je collega’s en gezamenlijk een leuke tijd doorbrengen tijdens activiteiten zoals wintersport, hackatons en conferentiebezoeken. Je krijgt niet alleen de mogelijkheid Front-End te ontwikkelen, maar ook vooral jezelf. Dit kan behaald

Bekijk vacature »

Senior Javascript developer

Functie Het platform is gebouwd in een moderne JavaScript stack, die gebruikt maakt van:  React.js  Redux  TypeScript  Node.js  Google Cloud functions (node.js)  Semantic UI Alle code wordt getest en beoordeeld door collega developers. De continuous integration pipeline maakt het mogelijk om elke dag waarde te leveren aan hun klanten. Het ontwikkelproces is pragmatisch en gebaseerd op Scrum. Wat je zult doen: Ten eerste kun je nadrukkelijk jouw eigen stempel drukken op de technologie, het product en de cultuur van het bedrijf. Je bent bezig met het uitwerken van de architectuur van nieuwe functionaliteiten op

Bekijk vacature »

Senior PHP developer met ambities tot Software Arc

Functie Momenteel zijn ze op zoek naar een ervaren PHP developer die zichzelf graag bezighoudt met zaken als architectuur en de algehele verbetering van structuren en standaarden. Het is eigenlijk meer operationeel als uitvoerend omdat je bezig gaat met zaken als het verder uitrollen en verbeteren van testautomatisering, codereviews, tickets en de doorloop hiervan en architectuurkeuzes. Mocht je hiernaast ook wat DevOps kennis meenemen is dit mooi meegenomen! Vanwege het kleine team maar de wereldwijde impact die zij leveren is er veel focus op kwaliteit. In deze functie werk je aan één van hun belangrijkste applicaties. Hierin werk je nauw

Bekijk vacature »

Back-end Developer

Functieomschrijving Heb jij kort geleden je HBO ICT Informatica diploma in ontvangst mogen nemen? Of heb je een aantal jaar ervaring als Software Developer en ben je klaar voor een nieuw hoofdstuk in jouw carrière? Voor een gewaardeerde werkgever in de regio van Goirle zijn wij op zoek naar een junior/medior Back-end Developer met affiniteit met MS Acess. Samen met een vooruitstrevend team ben je verantwoordelijk voor het ontwikkelen van maatwerk software voor hun klanten. Je hebt kennis of ervaring van SQL en affiniteit met MS Acess. Je bent klantvriendelijk en flexibel ingesteld en vindt het leuk om klanten te

Bekijk vacature »

Applicatieontwikkelaar Java EE

Bedrijfsomschrijving De IV- organisatie van de Belastingdienst is verantwoordelijk voor en verzorgt de ICT- voorzieningen. Het merendeel van de applicaties wordt op dit moment door de IV- organisatie zelf ontwikkeld, onderhouden en beheerd in het eigen data center. Naast de zorg voor continuïteit op de massale heffing- en inningsprocessen die plaatsvinden binnen een degelijke, stabiele omgeving, wordt er tevens volop gewerkt aan modernisering van het IV- landschap. Dit gebeurt deels intern door gebruik te maken van de expertise die intern aanwezig is, maar ook door het aantrekken van (kant-en-klaar) oplossingen en expertise uit de markt. Functieomschrijving De afdeling IV –

Bekijk vacature »

Senior .NET developer

Functie As a Senior .NET developer you will work in our Research & development team. Our team consists of 17 colleagues! We are currently busy setting up a completely new architecture for a new product. We use VS2022 and .NET 6.0 for our new product. Your function is therefore mainly backend oriented. Since we develop measuring equipment for the chemical industry, it is also very important to develop high-quality software for its control. You are also responsible for designing, implementing and testing new features. For this position its also very important to ensure future-proof and sustainable architecture. Eisen - A

Bekijk vacature »

Junior PHP Developer

Je maakt een vliegende start van je carrière, door meteen mee te bouwen aan de digitale aspecten van Coolblue. Wat doe je als Junior PHP Developer bij Coolblue? Als Junior PHP Developer ben je meteen vanaf de start onderdeel van een development team. Je kijkt veel mee met collega’s en volgt trainingen om te groeien als Junior Developer. Op dat moment komt je wil om steeds te blijven leren naar boven. Daarnaast pak je in de sprints ook je eigen stories op om Coolblue iedere dag een beetje beter te kunnen maken. Je sterk analytisch vermogen komt dan ook goed

Bekijk vacature »

.Net developer

Sogeti is een organisatie met een goede werksfeer en zo min mogelijk hiërarchische verhoudingen. Ga je bij ons als .Net Developer aan de slag? Dan werk je dagelijks met collega’s aan de mooiste IT-projecten. Deze snelgroeiende groep collega’s krijgt energie van hun vak en dat merk je op de werkvloer. Natuurlijk krijg jij de mogelijkheid je te certificeren. We organiseren regelmatig technische Meet-ups en doen we veel aan kennisdeling. Mede hierdoor zij wij dit jaar Microsoft Partner of the year geworden. Sogetisten staan klaar voor elkaar, hebben lol met elkaar en daarmee behalen we de mooiste resultaten! Werken bij Sogeti

Bekijk vacature »

Full stack developer Node.js, React Remote

Functie Als fullstack JavaScript developer vind jij het uitdagend om op basis van concrete klantvragen nieuwe functionaliteiten te ontwikkelen. Bij voorkeur worden deze functionaliteiten op een bepaalde manier geprogrammeerd, zodat ze door meerdere klanten te gebruiken zijn. Je hebt dus vaak te maken met abstracte vraagstukken. Om dit te kunnen realiseren sta je nauw in contact met de product owner en/of klant. Je bent niet alleen onderdeel van het development team, maar hebt ook vaak contact met de product-owner en/of klanten om daardoor inzichten te verzamelen die leiden tot productverbeteringen. • Inzichten verzamelen bij de klant en/of product owner •

Bekijk vacature »

Pagina: 1 2 volgende »

Donny Wie weet

Donny Wie weet

12/12/2012 15:05:49
Quote Anchor link
Hoi allemaal,

Ik krijg het niet voor elkaar dze div te centreren... ik heb align center al gebruikt... Iemand een idee?

Groetjes


Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<?php


<div id="header" style="margin:0;padding:0; position:fixed;left:0px;top:50px;width:750px;height:40px;text-align:left; background-color:#999;">

<
font color="#FFFFFF">Titel</font>
<
/div>

<
div id="header" align="center" style="margin:0;padding:0;position:absolute;left:550px;top:20px;width:750px;height:40px;text-align:left;z-index:33;">
<
img src="images/thumb.PNG" width="100px" height="100px" />
<
/div>



?>
 
PHP hulp

PHP hulp

04/05/2024 21:57:17
 
Chris PHP

Chris PHP

12/12/2012 15:09:10
Quote Anchor link
@Donny

Volgens mij is position idd absolute, en dan is het width bijvoorbeeld 1000px breed, dan is je margin-left: -500px;

Dus de margin-left is dan de helft van je totale breedte van je div.
Gewijzigd op 12/12/2012 15:09:55 door Chris PHP
 
Max -

Max -

12/12/2012 15:14:11
Quote Anchor link
Hoi!

even snel 2 puntjes;

1) Waarom maak je 2x dezelfde div aan?

en

2) Waarom doe je de styling op die manier?

Ik zou je aanraden om alle styling in een apart .css bestand te doen en deze te linken bovenin je html pagina.
Quote:
<link rel="stylesheet" href="css/style.css" />


Verder om je probleem op te lossen:

http://jsfiddle.net/tbrwb/1/
Gewijzigd op 12/12/2012 15:18:27 door Max -
 
Donny Wie weet

Donny Wie weet

12/12/2012 15:36:00
Quote Anchor link
Dat JSfiddle gebeuren snap ik voor geen meter... En dat margin de helft minder zetten werkt ook totaal niet...
 
Chris PHP

Chris PHP

12/12/2012 15:39:24
Quote Anchor link
@Donny,

Ik weet ook niet precies hoe de browser hiermee omgaat.

<div id="header" style="margin:0;padding:0; position:fixed;left:0px;top:50px;width:750px;height:40px;text-align:left; background-color:#999;">

<div id="header" align="center" style="margin:0;padding:0;position:absolute;left:550px;top:20px;width:750px;height:40px;text-align:left;z-index:33;">

Twee keer de zelfde id met compleet andere opmaak op dezelfde pagina. Gebruik hiervoor een css sheet, en geef ze beiden een andere id om problemen te voorkomen.
Gewijzigd op 12/12/2012 15:39:38 door Chris PHP
 
Donny Wie weet

Donny Wie weet

12/12/2012 15:40:17
Quote Anchor link
Ik gebruik voor deze pagina maar 1 pagina: index.php ik zal wel de IDs een andere naam geven :)

Toevoeging op 12/12/2012 15:44:24:

Heb de IDs een andere naam gegeven, maar nog hetzelfde, krijg ze niet gecentreerd...
 
Chris PHP

Chris PHP

12/12/2012 15:45:51
Quote Anchor link
Dit werkt bij mij gewoon

#body {
position: absolute;
width: 1000px;
height: 400px;
margin-left: -500px;
}
 
Donny Wie weet

Donny Wie weet

12/12/2012 15:54:20
Quote Anchor link
Vaag :S Ik heb nu:

<div id="header" style="margin:-375px; position:absolute;left:0px;top:50px;width:750px;height:40px; background-color:#999; z-index:100;">
test
</div>


En het werkt voor geen meter :S
 
Max -

Max -

12/12/2012 16:06:32
Quote Anchor link
@Donny Rustig aan, neem een kop koffie, anders gaat het nooit lukken! :)

jsfiddle is alleen om te laten zien wat de code doet.

Als ik jou was zou ik mijn advies volgen en de css is een apart bestand doen, dit houd je code een stuk overzichtelijker.

verder is het enige wat je met margin moet doen:

margin: 0 auto;

die 0 staat voor 0 pixels vanaf de bovenkant, de auto zorgt ervoor dat hij van zowel links als rechts even ver staat (dit geeft dus dat center effect).

http://www.w3schools.com/css/css_margin.asp

probeer is dit (CSS zit hier dus niet in een apart bestand):
Quote:
<style>
#header{
position:fixed;
margin: 0 auto;
width:750px;
height:40px;
text-align:left;
background-color:#999;
}

#header2{
margin: 0 auto;
position:absolute;
width:750px;
height:40px;
text-align:left;
z-index:33;
}
</style>

<div id="header">
<font color="#FFFFFF">Titel</font>
</div>

<div id="header2" align="center">
<img src="images/thumb.PNG" width="100px" height="100px" />
</div>


Als het nu nog niet lukt, heb je waarschijnlijk een css conflict. dan zal je eerst moeten uitzoeken waar je al CSS code hebt geschreven waardoor de div'jes links blijven hangen.
Gewijzigd op 12/12/2012 16:15:36 door Max -
 
Donny Wie weet

Donny Wie weet

12/12/2012 16:32:25
Quote Anchor link
Schiet mij maar in een mandje... Ik wordt er helemaal gallisch ziek van...
 
Wouter J

Wouter J

12/12/2012 16:36:25
Quote Anchor link
Dan stop je ermee. Als wij hier alle moeite doen om jou te helpen en jij reageert alleen maar met 'dat werkt niet' of 'ik wordt er ziek van' dan staat dat op z'n zachtst gedrukt onbeleefd.

Waar wordt je ziek van? Begrijp je de code niet? Dan raad ik je aan alles opzij te leggen en eens vanaf 0 te beginnen met leren. Naar mijn idee copy/past je code van her en der en denkt zo dat je het werkend kunt krijgen. Helaas is er ook kennis van zaken voor nodig om het voor elkaar te krijgen. Precies zoals je met een stapel bakstenen, een keuken, een douche en een bed niet direct een huis hebt.
 
Max -

Max -

12/12/2012 16:38:39
Quote Anchor link
Donny van Grondelle op 12/12/2012 16:32:25:
Schiet mij maar in een mandje... Ik wordt er helemaal gallisch ziek van...


hahaha ik herken het, morgen ga je er weer naar kijken en dan zie je het probleem in 5 minuten.

Wat je kan proberen is je site te openen in bijv firefox (chrome heeft deze functie ook volgensmij, IE zou ik niet weten, gebruik ik niet).
Met de rechtermuisknop kan je bij "inspect element" komen.
Vervolgens kan je daarmee je header div opzoeken, en kan je zien welke CSS die div beinvloed.


Verder heeft Wouter J wel een punt, aan "ik snap het niet/Het werkt niet" hebben wij niks. Een probleem omschrijving zou wel degelijk helpen. Blijft de div bijvoorbeeld nog steeds links staan?
Gewijzigd op 12/12/2012 16:51:02 door Max -
 
Donny Wie weet

Donny Wie weet

12/12/2012 17:03:46
Quote Anchor link
Ik snap dat jullie aan opmerkingen als fuck it niets hebben, maar zit hier al heel de middag mee te kloten...

De Div blijft links staan maar lijkt wel een margin omheen te zitten. Ik heb de EXACTE code van Max- overgenomen en in een apart document gezet en geload. Ook in dit geval blijft de Div aan de linkerkant staan.
 
Reshad F

Reshad F

12/12/2012 17:27:05
Quote Anchor link
Wat snap je niet aan JSFiddle? er staat html code er staat css code..
 
Donny Wie weet

Donny Wie weet

12/12/2012 17:28:20
Quote Anchor link
Wist niet dat het was om dingen te testen :)
 
Wouter J

Wouter J

12/12/2012 17:42:06
 
Donny Wie weet

Donny Wie weet

12/12/2012 17:51:04
Quote Anchor link
Ga ik zeker doen nadat ik mijn center probleem heb opgelost.
 
Mark Hogeveen

Mark Hogeveen

12/12/2012 19:14:14
Quote Anchor link
Ik denk dat je nog een beetje aan het beginnen bent, en dan kun je van dit soort problemen goed leren.

Wat ik zou doen als ik jou was:

- Eerst even de inline stijl uit de html tags halen en ze in een apart bestand plaatsen, en dat bestand includen. Zoals hierboven al staat geschreven in het topic.

- Dan zou ik zorgen dat je niet 2x hetzelfde id gebruikt, een id kan maar voor 1 html element worden gebruikt, wil je meer elementen benoemen met dezelfde naam, gebruik dan class="header" in plaats van id="header"

En ik heb dit probleem al heel vaak gezien bij anderen en mezelf.
Het is ook juist zo raar dat CSS wel kan floaten naar links, of naar rechts, maar niet in het midden. float:center heeft CSS nog nooit van gehoord, terwijl dat heeel handig zou zijn.
Ze zeggen dat stijl attributen van HTML zelf niet meer moeten worden gebruikt, omdat die verouderd zijn. Je gebruikt nu de font tag, en die is dus verouderd. Als je de tekst wilt kleuren moet je die tussen <span> en </span> zetten. Die span geef je een id of class en met CSS doe je dan de tekst kleuren met color:white
Echter is het wel nog gewoon goed dat je het HTML attribuut align="" gebruikt, maar dan uitsluitend om een div te centreren. Gebruik dan dus align="center"

Als dit nog steeds niet werkt, gebruik dan deze "formule" om divs in het midden te zetten: [de helft van het beeldscherm (50%)] min [breedte van div gedeeld door 2]
Dan heb je de left positie, en kun je deze gebruiken om de div position:absolute te geven.
De top positie kun je zelf aanpassen (dat is hoe hoog de div komt)
 
Wouter J

Wouter J

12/12/2012 19:22:41
Quote Anchor link
Quote:
Echter is het wel nog gewoon goed dat je het HTML attribuut align="" gebruikt, maar dan uitsluitend om een div te centreren. Gebruik dan dus align="center"

Oh? Alle vormen van inline of interne CSS zijn fout, op <style scoped> na. Tevens moet je align="center" nooit als centreer methode voor block elementen gebruiken.

Merk op dat voor horizontaal centreren het opgeven van een breedte (width) + margin: 0 auto; genoeg moet zijn en beter is dan met position: absolute; aan de slag te gaan. En ga je met de position: absolute; techniek aan de slag, dan raad ik je aan dit te gebruiken: http://d-graff.de/fricca/center.html (om problemen met deze methode te voorkomen)
 
Machiel K

Machiel K

12/12/2012 20:18:34
Quote Anchor link
" margin: 0 auto; " doet wonderen.

Probeer dit eens.
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
<!DOCTYPE html>
<html>

    <head>
        <title> Titel </title>
        <style>
            #header {
                background-color: #999;
                text-align: left;
                color: #FFFFFF;
                width: 500px; /* De breedte van de div */
                height: 40px; /* De hoogte van de div */
                margin: 0 auto; /* Dit zet de div in het midden */
            }
        </style>
    </head>

    <body>

        <div id="header"> De header </div>

    </body>

</html>


Je < ?php ? > is nergens voor nodig. Dit is als je een script gebruikt.
Gewijzigd op 12/12/2012 20:30:50 door Machiel K
 
Donny Wie weet

Donny Wie weet

12/12/2012 20:39:03
Quote Anchor link
Harry hogeveen op 12/12/2012 19:14:14:
Ik denk dat je nog een beetje aan het beginnen bent, en dan kun je van dit soort problemen goed leren.

Wat ik zou doen als ik jou was:

- Eerst even de inline stijl uit de html tags halen en ze in een apart bestand plaatsen, en dat bestand includen. Zoals hierboven al staat geschreven in het topic.

- Dan zou ik zorgen dat je niet 2x hetzelfde id gebruikt, een id kan maar voor 1 html element worden gebruikt, wil je meer elementen benoemen met dezelfde naam, gebruik dan class="header" in plaats van id="header"

En ik heb dit probleem al heel vaak gezien bij anderen en mezelf.
Het is ook juist zo raar dat CSS wel kan floaten naar links, of naar rechts, maar niet in het midden. float:center heeft CSS nog nooit van gehoord, terwijl dat heeel handig zou zijn.
Ze zeggen dat stijl attributen van HTML zelf niet meer moeten worden gebruikt, omdat die verouderd zijn. Je gebruikt nu de font tag, en die is dus verouderd. Als je de tekst wilt kleuren moet je die tussen <span> en </span> zetten. Die span geef je een id of class en met CSS doe je dan de tekst kleuren met color:white
Echter is het wel nog gewoon goed dat je het HTML attribuut align="" gebruikt, maar dan uitsluitend om een div te centreren. Gebruik dan dus align="center"

Als dit nog steeds niet werkt, gebruik dan deze "formule" om divs in het midden te zetten: [de helft van het beeldscherm (50%)] min [breedte van div gedeeld door 2]
Dan heb je de left positie, en kun je deze gebruiken om de div position:absolute te geven.
De top positie kun je zelf aanpassen (dat is hoe hoog de div komt)



oke... maar als mijn scherm nou "1000PX" breed is, en de jouwe is 1500, dan staat mijn pagina niet meer in het midden gecentreerd...
 

Pagina: 1 2 volgende »



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.