HTML i CSS po kolumnach chcę dodać zakładę "foother" W tym miejscu chę mieć IMG.

pytanie zadane 6 listopada 2021 w HTML i CSS przez Posejdon Początkujący (490 p.)

<div id="pojemnik">

<div id="logo"> 
 <h1>testuje tytul</h1>
</div>


<div id="column1">
<h3><em><a href="www.strona główna">Strona Główna </h3></em></a>

</div>
<div id="column2">
<h3><em><a href="www.strona główna"> O mnie <em></h3></a>

</div>
 <div id="column3">
<h3><em><a href="www.strona główna">Oferta<em></h3></a>
</div>
 <div id="column4">
<h3><em><a href="www.strona główna"> Kontakt<em></h3></a>
<div>


<div id="3zdj">
<img src="obrazek 1000xna1000">
</div>

Więc tak mam już jakies tam divy wypośrodkowane. Zrobiłem logo po logiem opcję wyboru jak widać, czyli klasyka.

Teraz chce wstawić zdjęcie, tak by było rozciągnięte przez cały ekran. akurat tutaj mam obrazek 1000pxna 1000px.

Jak widać wyżej otworzyłem nowego <diva> , próbowałem wpisać w #3zdj {clear:both i margin;left} przenieść na dół by spróbować co się stanie i nic się nie stało, raz się rozsypały opcje wyboru pod tytułem coś zjebałem ;/ .

Czy nie mogę traktować strony jak roli papieru w której po prostu dokładam kolejne <divy> (sory za skojarzenie, ale tak sobie myślałem)

komentarz 6 listopada 2021 przez ScriptyChris Mędrzec (190,190 p.)

Pokaż kod CSS.

próbowałem wpisać w #3zdj {clear:both i margin;left}

Jeśli to nie jest pomyłka w treści posta, to niepoprawnym jest zapis:

margin;left

, tzn. jeśli chcesz ustawić sam lewy margines, to musisz zapisać:

margin-left: <wartość>;

komentarz 7 listopada 2021 przez Posejdon Początkujący (490 p.)

<style>


a {
    text-decoration: none;
    color:white;
}

a:hover {
	color: yellow;
}


h1{
text-align: center; color:white;
font-size: 30px

;}

#pojemnik 
{
width:100%;
background-color:white;
padding:5px;
padding-top:5px;
margin-left:auto;
margin-right:auto;
text-decoration: none;
}
#logo
{height:85px;
background-color:#192533;
text-decoration:blink; 
width:100%;
font-weight:bold; 
padding-top:2px;


}

#column1
{
height:50px;
background-color:#1e90ff;
padding:1%;
width:23% ;
text-align:center;
float:left;
}
#column2
{
height:50px;
background-color:#1e90ff;
padding:1%;
width:23% ;
float:left;
text-align:center

}
#column3
{
height:50px;
background-color:#1e90ff;
padding:1%;
width:23%;
text-align:center;
float:left;
}
#column4
{
height:50px;
background-color:#1e90ff;
padding:1%;
width:23%;
text-align:center;
float:left;
text-decoration: none;


#3zdj
text-align:left;
margin-left:auto;


</style>

</head>
<body>

<div id="pojemnik">

<div id="logo"> 
 <h1>testuje tytul</h1>
</div>


<div id="column1">
<h3><em><a href="www.strona główna">Strona Główna </h3></em></a>

</div>
<div id="column2">
<h3><em><a href="www.strona główna"> O mnie <em></h3></a>

</div>
 <div id="column3">
<h3><em><a href="www.strona główna">Oferta<em></h3></a>
</div>
 <div id="column4">
<h3><em><a href="www.strona główna">Kontakt<em></h3></a>

<div>

<div id="3zdj">
<img src="./zdjecie 1000px na 1000px"

</div>
 
 
 
  
</body>
</html>

Mam tak, i to zjdęcie pojawia się, ale jest przy prawej i ucieka po za stronę.