Søg
Avatar billede larsholmgaard_dk Nybegynder
04. april 2006 - 15:05 Der er 19 kommentarer og
1 løsning

ID to vidt forskellige steder i FF og IE. Suk, hjælp søges.

Er der nogen, der kan hjælpe mig med at se, hvad jeg ikke selv kan få øje på her? Nedenstående side virker perfekt i FF, men ID'et "menuRight" står helt skævt i IE:
http://www.larsholmgaard.dk/indexSearch.php

Lige nu er det en underside, men den kommer til at være den generelle indexside, så søgefunktionen altid er til stede. Jeg har bare mine kvaler med at det hele til at stå korrekte i begge browsere på samme tid.

Her er et direkte link til min midlertidige test-CSS:
http://www.larsholmgaard.dk/v3search.css

Og dette udgør toppen i mine filer:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Alle tips og gode råd modtages med stor taknemmelighed.
Avatar billede mclemens Nybegynder
04. april 2006 - 16:27 #1
<div id="search"><form name="search" method="post" action="/indexSearch.php?l=dk"><input name="searchString" type="text"><input name="Submit" class="formButtonInv" value="Søg" type="submit">
</form>
</div>

-> <br> (hjælper lidt... men ikke nok :P

<div id="menuBG00">
Avatar billede mclemens Nybegynder
04. april 2006 - 16:27 #2
... med hensyn til css: margin:0px 0px 0px 0px; -> margin:0px;
Avatar billede larsholmgaard_dk Nybegynder
04. april 2006 - 21:37 #3
Mystisk... men, du har ret i at et <br> får højre menu ned i det rigtige niveau i IE. Men, det er desværre ikke helt nok! :-)

Jeg sidder lige og eksperimenterer lidt mere, så er der andre bud, så sig endelig til.
Avatar billede mclemens Nybegynder
04. april 2006 - 23:03 #4
nu kan jeg se siden nogenlunde igen :)
... prøv med at tage dette stykke ud og erstatte de nederste css'er :)

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html>

<head>

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1"><title>Ingen titel</title>

<link rel="stylesheet" type="text/css" href="css.css">
<style type="text/css">
body                 { font-family: Verdana, Geneva, Arial, helvetica, sans-serif; color: #FFFFFF; background-color: #8AC1DE; font-size: 12px;  margin: 0px 0px 0px 0px;}
td                    { font-family: Verdana, Geneva, Arial, helvetica, sans-serif; color: #FFFFFF; background-color: #8AC1DE;}
th                    { font-family: Verdana, Geneva, Arial, helvetica, sans-serif; color: #FFFFFF; background-color: #8AC1DE;}

h1                    {color: #FFFFFF; font-size:26px}

h2                    {color: #444444; font-size:18px}

h3                    {color: #FFFFFF; font-size:14px; margin-bottom: -10px}

p.pageIntro            {color:#FFFFFF; margin-bottom: 60px}

a                    {color: #FFFFFF; text-decoration: underline;}
a:hover                {color: #444444;}

#top                {height:96px; width: auto; margin: 0px; background-color:#FFFFFF; }


#logo                {float: left; height:34px; width: 257px; position:relative; top:14px; left:0px; margin: 0px; background-image:url(images/logo.gif);}
#search                {float: right; height:17px; position:relative; top:18px; right:0px; margin: 0px; font-size:10px; text-align:right; color: #666666;}




a.topTools            {color: #666666; text-decoration:none; font-size:10px;}
a.topTools:hover    {text-decoration:underline;}



a.menuON            {color: #FFFFFF; text-decoration:none; font-size:10px;}
a.menuON:hover        {text-decoration:underline;}

a.menuOFF            {color: #6b96ac; text-decoration:none; font-size:10px;}
a.menuOFF:hover        {color: #444444; text-decoration:underline;}



#bottom                {clear: both; width: auto; margin: 0px 0px 0px 0px; background-color:#8AC1DE;}
#bottomContent        {height:auto; width: 937px; margin-left: auto; margin-right: auto; margin-top: 20px; background-color:#8AC1DE; }

.example                    {margin-bottom: 0px; }
.exampleHeader                {color: #FFFFFF; font-size:20px; }
.exampleFooter                {color: #FFFFFF; font-size:9px; }
a.exampleFooter             {color: #FFFFFF; }
a.exampleFooter:hover        {color: #444444; }
.exampleRelevance            {color: #8AC1DE; font-size:9px; }
.examplePicture             {padding: 40px 0px 40px 40px; color: #636363; background-color:#FFFFFF; }
.exampleDescription         {vertical-align: top; padding: 40px 40px 40px 0px; color: #636363; background-color:#FFFFFF; }
.exampleDescription p        {color: #636363; }
.exampleDescription a        {color: #8AC1DE; font-size: 10px}
.exampleDescription a:hover    {color: #444444; }
.exampleDescription h3        {color: #8AC1DE; font-size:12px; margin-top: 0px; }
.pageFooter                    {color: #444444; font-size:9px; height:34px; width: 400px; }
.pageFooter img                {border: 0px;}
.pageFooter a                {color: #FFFFFF; text-decoration: underline; }
.pageFooter a:hover            {color: #444444; }

form                        { color: #FFFFFF; margin-bottom: 60px}
INPUT                        { color: #444444; background-color: #FFFFFF; border: #8AC1DE 1px solid; }
TEXTAREA                    { color: #444444; background-color: #FFFFFF; border: #8AC1DE 1px solid; }
.formButton                    { background-color: #8AC1DE; border: #FFFFFF 1px solid; font-size: 10px; color: #FFFFFF; }
.formButton:hover            { background-color: #FFFFFF; border: #FFFFFF 1px solid; font-size: 10px; color: #8AC1DE; cursor:pointer; }
.formButtonInv                { height: 20px; width: 40px;background-color: #FFFFFF; border: #8AC1DE 1px solid; text-align:center; font-size: 10px; color: #8AC1DE; }
.formButtonInv:hover        { height: 20px; width: 40px;background-color: #8AC1DE; border: #8AC1DE 1px solid; text-align:center; font-size: 10px; color: #FFFFFF; cursor:pointer; }
.formButtonInv:active        { border: #8AC1DE 1px solid; }
p.error                        { color: #444444; font-weight:bold;}






#menuRight            {float: right; height:17px; width: 200px;background-color:#8A00DE; font-size:10px; text-align:right; color: #ffffff;}

#menuBG00            {clear:left;float: left; height:17px; width: 100%; position:relative; top: 45px; left: 0px; background-image:url(images/menu_00.gif);}
.menu00{height: 17px; width: 84px; float:left;position:relative; top: 3px; left: 0px;}

#topContent{height:96px; width: 937px; margin:0px auto;background-color:#aaFFFF; }
</style>


<script type="text/javascript">
<!--

//-->
</script>

</head>


<body>



    <div id="topContent">
        <div id="logo"></div>
        <div id="search"><form name="search" method="post" action="/indexSearch.php?l=dk"><input type="text" name="searchString"><input name="Submit" type="submit" class="formButtonInv" value="Søg"></form></div>
        <div id="menuBG00">
            <div class="menu00"><a href="index.php?p=0&amp;l=dk" class="menuON">10 nyeste</a></div>

            <div class="menu00"><a href="index.php?p=1&amp;l=dk" class="menuOFF">Webdesign</a></div>
            <div class="menu00"><a href="index.php?p=2&amp;l=dk" class="menuOFF">GUI design</a></div>
            <div class="menu00"><a href="index.php?p=3&amp;l=dk" class="menuOFF">Flash</a></div>
            <div class="menu00"><a href="index.php?p=4&amp;l=dk" class="menuOFF">3D grafik</a></div>
            <div class="menu00"><a href="index.php?p=5&amp;l=dk" class="menuOFF">Foto</a></div>
            <div class="menu00"><a href="index.php?p=6&amp;l=dk" class="menuOFF">Tryksag</a></div>

       
        <div id="menuRight"><a href="/indexSearch.php?p=0&amp;l=en" class="topTools">English</a> | <a href="about.php?l=dk" class="topTools">Hvem?</a> | <a href="contact.php?l=dk" class="topTools">Kontakt</a></div>


    </div>
</div>



</body></html>
Avatar billede mclemens Nybegynder
04. april 2006 - 23:03 #5
... prøv med at tage dette stykke ud og erstatte de nederste css'er :)
dette stykke = det fra bodyen :)
Avatar billede larsholmgaard_dk Nybegynder
04. april 2006 - 23:19 #6
Ups, jeg kom vist til at smadre lidt for meget. Jeg prøver lige at lave en helt skrabet version i morgen, hvor der kun er de elementer, det drejer sig om, uden alt gøjlet udenom. Jeg sætter stor pris på din hjælpsomhed mclemens!
Avatar billede larsholmgaard_dk Nybegynder
04. april 2006 - 23:20 #7
I bund og grund skal det bare virke som min nuværende side www.larsholmgaard.dk - eneste forskel er at jeg gerne vil have tilføjet søgefeltet oppe til højre på siden. Tilsyneladende enkelt, men det driller mig gevaldigt.
Avatar billede mclemens Nybegynder
04. april 2006 - 23:27 #8
jeg tror det der driller er det clear og sådan... plejer at bygge det op i ret faste rammer selv d.v.s. float:left eller right samt width og height... position relative og margins samt clear kan hurtigt drille... kigger lige på din normale side bare søgefeltet siger du...
Avatar billede mclemens Nybegynder
04. april 2006 - 23:38 #9
prøv dette

css erstat #search med denne:
#search{width:200px;position:absolute;top:0px;right:0px;float:right!important;}

og udskift fra <body> ned til <div id="bottom"> med det her:


<body>
            <div id="top">
    <div id="topContent" style="background-color:red;">




        <div id="logo"></div>
        <div id="menuBG00">
            <div id="menu00"><a href="index.php?p=0&amp;l=dk" class="menuON">10 nyeste</a></div>
            <div id="menu01"><a href="index.php?p=1&amp;l=dk" class="menuOFF">Webdesign</a></div>

            <div id="menu02"><a href="index.php?p=2&amp;l=dk" class="menuOFF">GUI design</a></div>
            <div id="menu03"><a href="index.php?p=3&amp;l=dk" class="menuOFF">Flash</a></div>
            <div id="menu04"><a href="index.php?p=4&amp;l=dk" class="menuOFF">3D grafik</a></div>
            <div id="menu05"><a href="index.php?p=5&amp;l=dk" class="menuOFF">Foto</a></div>
            <div id="menu06"><a href="index.php?p=6&amp;l=dk" class="menuOFF">Tryksag</a></div>

        </div>

        <div id="menuRight"><a href="/index.php?p=0&amp;l=en" class="topTools">English</a> | <a href="about.php?l=dk" class="topTools">Hvem?</a> | <a href="contact.php?l=dk" class="topTools">Kontakt</a></div>

<div id="search"><form name="search" method="post" action="/indexSearch.php?l=dk"><input name="searchString" type="text"><input name="Submit" class="formButtonInv" value="Søg" type="submit"></form></div>

</div>


<div id="bottom">
Avatar billede mclemens Nybegynder
04. april 2006 - 23:40 #10
hov denne også :P
#topContent{position:relative;height:96px; width: 937px; margin: 0px auto;}
Avatar billede mclemens Nybegynder
04. april 2006 - 23:41 #11
og så valgte jeg lige at rette search igen :D
#search{width:200px;position:absolute;top:10px;right:10px;text-align:right;}
Avatar billede mclemens Nybegynder
04. april 2006 - 23:42 #12
må hellere huske at sige rettelserne er baseret på din normale side...
Avatar billede larsholmgaard_dk Nybegynder
05. april 2006 - 10:01 #13
TUSINDE TAK mclemens!! Nu virker det endelig! Jeg skal lige se på SØG-knappen, der skifter lidt størrelse fra IE til FF, men det er heldigvis småting. Jeg er meget glad for din indsats, mange, mange tak! Læg et svar og du vil blive belønnet. :-)
Avatar billede mclemens Nybegynder
05. april 2006 - 10:03 #14
TUSINDE TAK mclemens!!
- det var så lidt :)

Jeg skal lige se på SØG-knappen, der skifter lidt størrelse fra IE til FF, men det er heldigvis småting.>
- prøv en style="width:ypx;" hvor y=et antal px... ;)

Læg et svar og du vil blive belønnet. :-)
- her er et svar ;)
Avatar billede mclemens Nybegynder
05. april 2006 - 10:06 #15
f.eks.: <input name="Submit" class="formButtonInv" value="Søg" type="submit" style="width:50px;">
Avatar billede larsholmgaard_dk Nybegynder
05. april 2006 - 10:31 #16
Jeps, jeg opdagede at jeg var kommet til at overskrive størrelsen på submit knappen med min backup css, men tak for det alligevel! :-)
Avatar billede mclemens Nybegynder
05. april 2006 - 11:35 #17
- og tak for point :)
Avatar billede larsholmgaard_dk Nybegynder
05. april 2006 - 14:55 #18
Så, nu virker det. :-)

Men, hvordan kan det være at selve linkområdet på linkene ovre til højre (English, Hvem? og Kontakt) er meget lavt? I FF kommer der kun link-hånd, når man har musen over det nederste af teksten, mens der er cursorhånd over hele teksten i IE? Højden står til 17 px i CSS'en...
Avatar billede mclemens Nybegynder
05. april 2006 - 16:13 #19
Hovsa, så kaster vi lige en height på... ;)

#search{width:200px;height:30px;position:absolute;top:10px;right:0px;text-align:right;}
Avatar billede larsholmgaard_dk Nybegynder
05. april 2006 - 16:43 #20
DOUGH! Ja, selvfølgelig... hvorfor så jeg ikke det. TAK!! :-D
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
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 09:38 Microsoft har igen ødelagt mit højreklik Af valby i Windows
30/0714:41 To mails fra YouSee - Jeg tror ikke altid på tilfældigheder Af mort1 i Andet sikkerhed
27/0714:34 Hjælp til at kunne skanne negativer på Plustek 8300i SE Af Mariann i Foto & video
27/0713:58 Mapperne Dokumenter og Overførsler er forsvundet efter geninstallation af Win11 Af bragger i Windows
25/0713:55 Ukendt sender e-mails fra - og til min e-mail adresse Af mort1 i Andet sikkerhed
White papers
Flere white papers »