Ocena wątku:
  • 0 głosów - średnia: 0
  • 1
  • 2
  • 3
  • 4
  • 5
Problem z podziałem nagłówka na dwie części css
#1
Witam, zrobiłem standardowy szablon gdzie u góry jest nagłówek po lewej menu, środek to treść u dołu stopka.
Mój problem:
Chciałbym podzielić nagłówek na dwie części, a mianowicie pierwsza część to miałoby by być miejsce na logo około 187 px szerokość i 151px wysokośći natomiast reszta nagłówka stanowiłoby tło graficzne z jakimś napisem. Nie wiem jak to zrobić, będę wdzięczny za wszelkie porady. Poniżej wklejam kod xhtml i css
Kod:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link href="style.css" media="screen" rel="stylesheet" type="text/css" />
<link href="color.css" media="screen" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="main_wrapper">
      <div id="header">
        <div id="header_inner">
        <h1>Naglowek</h1>
      </div>
    </div>
  <div id="nav">
    <div id="nav_inner">
      <ul>
        <li><a href="index.html">Link 1</a></li>
        <li><a href="index.html">Link 2</a></li>
        <li><a href="index.html">Link 3</a></li>
        <li><a href="index.html">Link 4</a></li>
        <li><a href="index.html">Link 5</a></li>
      </ul>
    </div>
  </div>
  <div id="content">
    <div id="content_inner">
    <p>Opis</p>
    </div>
  </div>
  <div id="footer">
    <div id="footer_inner">
      <p>Stopka</p>
    </div>
  </div>
</div>
</body>
</html>
kod css
Kod:
body {
    text-align:center;
    }
#main_wrapper {
    max-width:960px;
    min-width:720px;
    margin-left:auto;
    margin-right:auto;
    text-align:left;
    }
    

#header {
    
    }
#nav {
    width:140px;
    float:left;    
    }
#content {margin-left:140px;
    }
#footer {
    clear:both;
    background:#DDC;
    }
#header_inner, #nav_inner, #content_inner {
    overflow:hidden;
    }
#header_inner {
    padding:1em 2em;
    }
#nav_inner {
    padding:1em .5em;
    border-right:3px solid #B33;
    }
#content_inner {
    padding:1em 1em 1em 1.5em;
    }
#footer_inner {
    padding:.5em 1em;
    text-align:center;
    }
Odpowiedz
#2
Nie prościej ustalić tło dla tego nagłówka (backgroundSmile i potem zrobić logo w Gimpie (jedna część to te logo szerokości 187px, a reszta to napis?

Jeżeli to Ci nie odpowiada to podziel nagłówek na dwa divy i przypisz im odpowiednie wymiary.
Odpowiedz
#3
Wole mieć dwa oddzielne pliki graficzne na logo i tło żeby mieć kontrolę na obramowaniem itp. Właśnie nie wiem jak podzielić nagłówek żeby to wszystko działało, bo jak dodałem do header_inner logo_inner i nadałem odpowiednie wartości to jak chciałem coś napisać w miejscu tła to pisało się w miejscu loga, w ogóle cały nagłówek się sypał. Jeśli mógłby ktoś mi napisać jak ten nagłówek podzielić żeby sprawnie działał.
Odpowiedz


Podobne wątki…
Wątek: Autor Odpowiedzi: Wyświetleń: Ostatni post
  ukrywanie/pokazywanie części kodu dam-pro 1 2,155 20-07-2012, 22:00
Ostatni post: camelrafal
  Podświetla tekst lub rozbija ramkę na 2 części - czemu? Saab 3 3,422 02-03-2012, 01:48
Ostatni post: Moody
  Przenoszenie do nagłówka toma5z 3 3,253 13-05-2011, 19:47
Ostatni post: toma5z
  Jak zrobić takie dwie karty na stronie? messi19125 1 2,449 27-04-2011, 21:23
Ostatni post: Ancik
  Dwie listy rozwijane - problem! benny 1 1,936 15-10-2010, 14:11
Ostatni post: ixtab

Skocz do:


Użytkownicy przeglądający ten wątek: 1 gości
Sponsorzy i przyjaciele
SeoHost.pl