Προς το περιεχόμενο

προβλήμα με css


bscyb

Προτεινόμενες αναρτήσεις

Καλησπέρα έχω φτιάξει αυτήν εδώ την φόρμα :

 

 

91475991.png

 

και αυτό που προσπαθώ να κάνω αλλά δεν τα καταφέρνω είναι να φέρω το label και το select στην ίδια ευθεία (δηλαδή το label Όνομά Αλγόριθμου και η selection list να είναι στην ίδια γραμμή)

 

HTML

 


<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<meta http-equiv="date" content="Mon,14 May 2012" />
<title>Αναζήτηση Αλγορίθμου</title>
<link rel="stylesheet" href="menu.css" type="text/css" />
<link rel="stylesheet" href="style.css" type="text/css" />
<meta name="description" content="Αναζήτηση Αλγορίθμων αναζήτησης & ταξινόμησης ,Search for Sort & Search Algorithms" />
<meta name="keywords" content="Αναζήτηση Αλγορίθμων,Anazitisi Algorithmon,Search for Algorithms" />
<meta name="revised" content="14/5/2012"
<meta name="author" content="Nikos" />
<link rel="shortcut icon" href="img/favicon.ico" />
</head>
<body>
<div id="content">
<ul id="mbmenuebul_table" class="mbmenuebul_menulist" style="width: 963px; height: 33px;">
<li class="spaced_li"><a href="index.php" target="_self"><img id="mbi_mbmenu_1" src="img/menu_images/index.png" name="mbi_mbmenu_1" width="123" height="33"
style="vertical-align: bottom;" border="0" alt="Αρχική Σελίδα" title="" /></a></li>
<li class="spaced_li"><a href="calgorithms.php" target="_self"><img id="mbi_mbmenu_2" src="img/menu_images/c.png" name="mbi_mbmenu_2" width="168" height="33"
style="vertical-align: bottom;" border="0" alt="Αλγόριθμοι σε C" title="" /></a></li>
<li class="spaced_li"><a href="cppalgorithms.php" target="_self"><img id="mbi_mbmenu_3" src="img/menu_images/cpp.png" name="mbi_mbmenu_3" width="168" height="33"
style="vertical-align: bottom;" border="0" alt="Αλγόριθμοι σε C++" title="" /></a></li>
<li class="spaced_li"><a href="javaalgorithms.php" target="_self"><img id="mbi_mbmenu_4" src="img/menu_images/java.png" name="mbi_mbmenu_4" width="168" height="33"
style="vertical-align: bottom;" border="0" alt="Αλγόριθμοι σε JAVA" title="" /></a></li>
<li class="spaced_li"><a href="search.php" target="_self"><img id="mbi_mbmenu_5" src="img/menu_images/search.png" name="mbi_mbmenu_5" width="168" height="33"
style="vertical-align: bottom;" border="0" alt="Αναζήτηση Αλγορίθμου" title="" /></a></li>
<li><a href="links.php" target="_self"><img id="mbi_mbmenu_6" src="img/menu_images/links.png" name="mbi_mbmenu_6" width="168" height="33"
style="vertical-align: bottom;" border="0" alt="Προτεινόμενα Links" title="" /></a></li>
</ul>
<script type="text/javascript" src="js/menu.js"></script>
<div id="text">
<h3 class="searchalg">Αναζήτηση Αλγορίθμου</h3>
<div id="searchform">
<div id="form2">
<form name="sform" id="sform" method="post" action="submitsform.php">
<label for="algname">Ονομά Αλγορίθμου:</label>
<select name="algname" tabindex="1">
<option value="linear">Αλγόριθμος γραμμικής αναζήτησης (Linear search)</option>
<option value="binary">Αλγόριθμος δυαδικής αναζήτησης (Binary search)</option>
<option value="bst">Δυαδικά δένδρα αναζήτησης (Βinary search trees)</option>
<option value="dfs">Αναζήτηση Κατά Βάθος (Depth-first search (DFS))</option>
<option value="bfs">Αναζήτηση κατά πλάτος (Breadth-first search (BFS))</option>
<option value="Dijkstra">Αλγόριθμος του Dijkstra (Dijkstra's algorithm)</option>
<option value="bubble">Ταξινόμηση φυσαλίδας (Bubble sort)></option>
<option value="selection">Ταξινόµηση µε Επιλογή (Selection sort)</option>
<option value="insertion">Ταξινόµηση µε Εισαγωγή (Insertion sort)</option>
<option value="merge">Ταξινόμηση με συγχώνευση (Merge sort)</option>
<option value="quick">Γρήγορη ταξινόµηση (Quick sort)</option>
<option value="shell">Ταξινόμηση του Shell (Shell sort)</option>
<option value="heap">Ταξινόμηση σωρού (Heap sort)</option>
</select>
<label for="proglanduage">Γλώσσα Προγραμματισμού:</label>
<select name="proglanguage" tabindex="2">
<option value="C">C</option>
<option value="C++">C++</option>
<option value="JAVA">JAVA</option>
</select>
<button type="submit" name="submitsform" id="submitsform">Αναζήτηση</button>
</div>
</div>
<div id="endsform">
</div>
</div>
</div>
<div id="footer">
<ul class="bottom-menu">
<li><a href="contact.php" target="_self">Επικοινωνία</a></li>
<li><a href="help.php" target="_self">Βοήθεια</a></li>
<li><a href="sitemap.php" target="_self">Sitemap</a></li>
</ul>
</div>
</body>
</html>
>

 

 

και CSS:

 


body
{
background-image: url("img/background2.jpg");
background-attachment: fixed;
}

#content
{
margin-top: 20px;
margin-left: auto;
margin-right: auto;
width: 963px;
background-color: #FFFFFF;
}

#text
{
width: 100%;
padding-top: 20px;
height:100%;
text-align: left;
}


#footer
{
margin-left: 195px;
width: 963px;
}


h3.searchalg
{
color: #000000;
font-size: 20px;
}


#searchform
{
background-color:#d3d3d3;
margin-left:50px;
margin-right:50px;
padding-top: 5px;
padding-bottom: 100px;
}

#form2
{
padding-top: 20px;
width: 500px;
margin-left: auto;
margin-right: auto;
}

#form2 button
{
width: 100px;
float: right;
margin-top: 20px;
margin-right:280px;
}

#form2 select
{
padding: 2px;
width: 375px;
border: 2px solid #ccc;
color: #000000;
font-size: 15px;
}

#form2 label
{
text-align: left;
float: left;
margin-right: 15px;
width: 200px;
padding-top: 5px;
color: #000000;
}

#endsform
{
padding-bottom: 300px;
}


>

Συνδέστε για να σχολιάσετε
Κοινοποίηση σε άλλες σελίδες

Please πέρνα τη σελίδα σου στο JSFiddle.com ή βάλτην κάπου online για να μπορούμε να την δούμε με developer tools.

 

Για μένα προσωπικά η ερώτηση ως έχει είναι too much work για να ασχοληθώ, πιθανόν και για άλλους. Help us to help yourself.

Συνδέστε για να σχολιάσετε
Κοινοποίηση σε άλλες σελίδες

Please πέρνα τη σελίδα σου στο JSFiddle.com ή βάλτην κάπου online για να μπορούμε να την δούμε με developer tools.

 

Για μένα προσωπικά η ερώτηση ως έχει είναι too much work για να ασχοληθώ, πιθανόν και για άλλους. Help us to help yourself.

http://jsfiddle.net/wQBwg/

 

pant13 το float:right στο select δεν διορθώνει το πρόβλημα.

Συνδέστε για να σχολιάσετε
Κοινοποίηση σε άλλες σελίδες

Αύξησε το width του id=form2. Όταν το έκανα 710, όλα ήρθαν στη θέση τους.

>
#form2
{
padding-top: 20px;
width: 710px;
margin-left: auto;
margin-right: auto;
}

 

Επίσης μετά το κλείσιμο της πρώτης select, βάλε το παρακάτω

>
<div style="clear:both;"></div>

Συνδέστε για να σχολιάσετε
Κοινοποίηση σε άλλες σελίδες

Δημιουργήστε ένα λογαριασμό ή συνδεθείτε για να σχολιάσετε

Πρέπει να είστε μέλος για να αφήσετε σχόλιο

Δημιουργία λογαριασμού

Εγγραφείτε με νέο λογαριασμό στην κοινότητα μας. Είναι πανεύκολο!

Δημιουργία νέου λογαριασμού

Σύνδεση

Έχετε ήδη λογαριασμό; Συνδεθείτε εδώ.

Συνδεθείτε τώρα
  • Δημιουργία νέου...