Avatar billede michaeltryl Seniormester
21. april 2014 - 17:48 Der er 6 kommentarer og
1 løsning

responsive design

Jeg er ved at lave min side om til responsive design.
jeg ønsker nu at menuen ligger ovenpå <img src="layout/top.jpg">
det skal ligge det samme sted uanset hvilket device man ser det på.
har forsøgt med forskellige løsninger, men synes ikke det kan lykkes.
håber en kan hjælpe :-)

min html ser sådan ud

<img src="layout/top.jpg">
<div id="wrapper">

<div id="content">
</div>

<div id="menu">
</div>

</div>

min css
#wrapper {
    top:50px;
    max-width: 900px;
    width: 100%;
    margin: 0 auto;
    position:absolute;
    }

#content {
width: 100%;
box-shadow: 10px 10px 5px #888888;
Background: #c3d6e4;
Padding:5px;
Color:#000000;
}

#menu {
    width: 100%;
    box-shadow: 10px 10px 5px #888888;
    Background: #4E565B;
    Padding:5px;
    Color:#ffffff;
    Top:50px;
    position:absolute;
Avatar billede TIversen Novice
21. april 2014 - 18:17 #1
Hej Med dig,

Jeg ved godt at dette ikke svarer på dit spørgsmål, men har du overvejet at bruge Bootstrap? Selvom det ikke er at "kode det hele selv", så er det et utrolig kraftfuldt framework, som sagtens kan bruge som fundament til lækker side man selv har kode. Bootstrap er mobile first, så der er du ihverfald sikret med hensyn til responsiveness.

Min egen side NemProgrammering.dk er lavet i Bootstrap og er 100% responsive. Se her: http://www.nemprogrammering.dk/
Avatar billede claes57 Ekspert
21. april 2014 - 20:17 #2
du bliver nok nød til at sætte et minimumskriterium.
Min 'smartphone' (ja - den kan gå på nettet) nokia c3-01 med skærm på 320*240 behøver du ikke at tage med i 'uanset hvilket device'. Jeg kender heller ikke andre med samme model, som bruger den på nettet.
Avatar billede michaeltryl Seniormester
21. april 2014 - 20:49 #3
vil lige kigge nærmere på bootstrap ved lejlighed.
skriver når jeg har kigget nærmere :-)
Avatar billede michaeltryl Seniormester
26. april 2014 - 10:00 #4
Bootstrap er helt sikkert en mulighed.
Kan du hjælpe med at placere navbar oven på top.jpg
Det er mit logo som jeg godt vil have den til at ligge ovenpå, men kan ikke regne ud hvor jeg skal rette.
Har kigget i css filerne og forsøgt at rette lidt i selve sidens kode uden held.

<nav class="navbar navbar-default" role="navigation" style="margin-top:100px;">

Lægger den under billedet
Avatar billede nodesapps Nybegynder
01. maj 2014 - 20:41 #5
Det er svært at sige uden et live eksempel, da der sikkert er specielle regler for css filen når den skifter til responsive som du ikke har med i ovenstående kode. Kan det passe? Har du nogle media query i din css fil?
Avatar billede michaeltryl Seniormester
04. maj 2014 - 15:05 #6
Det blev bootstrap som vandt
TIversen, vil du smide et svar så får du point :-)
Avatar billede michaeltryl Seniormester
02. februar 2015 - 11:05 #7
lukker her
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester